Question

我有以下代码方案，其中e.target.parentNode.parentNode.removeChild( e.target.parentNode );无法访问deleteUser。有没有办法连接它或任何其他solution？

  // Delete users for ADMIN with GET 
 document.addEventListener( "click", function(e) {

      if (e.target.classList.contains( "btnDeleteUser" )) {
          /// get users based on id
          sUserId = e.target.getAttribute( "data-userId" );
          //console.log(sUserId);
          getAjax("api_delete_user.php?id=" + sUserId, deleteUser );
      }
  });

 function deleteUser ( ajUserDataFromServer ) {

                  if (ajUserDataFromServer.status == "ok") {

                      //console.log( "USER DELETED FROM THE DATABASE" );
                      e.target.parentNode.parentNode.removeChild( e.target.parentNode );

                  } else {

                      //console.log("USER NOT DELETED FROM THE DATABASE");
                      showErrorMessage( "Deleting User Failed - Try again" );

                  }
 }

  // Main ajax function using callback for getting data from the server
  function getAjax( sUrl, callback) {
    var ajax = new XMLHttpRequest();
    ajax.onreadystatechange = function() {
        if ( this.readyState == 4 && this.status == 200 ) {          
            ajDataFromServer = JSON.parse( this.responseText );
            callback( ajDataFromServer );
            }
        }

    ajax.open( "GET", sUrl, true );
    ajax.send();

  }

Answer 1

一种方法是将事件变量传递给您的函数<EditItemTemplate> <asp:DropDownList ID="DropDownList1" runat="server" Height="22px" Width="130px" SelectedValue='<%# Bind("team") %>' DataSourceID="XmlDataSource1" DataTextField="companyname" DataValueField="companyname"> </asp:DropDownList> <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/xml/teams.xml"></asp:XmlDataSource> </EditItemTemplate>

推荐：为您的元素添加ID并在您的函数中找到它deleteUser

deleteUser

Answer 2

您可以使用thunk将事件对象传递到函数周围的闭包中。

thunk基本上是一种延迟向函数传递参数的方法，当你调用它时你提供了第一个参数，它将返回一个接受第二个参数的函数，当你提供第二个参数时它会执行函数两个论点都在关闭。

基本上代替foo(1, 2)，您将使用foo(1)(2)来执行基础功能。

document.addEventListener("click", function(e) {
  getAjax("api_delete_user.php?id=" + sUserId, deleteUser(e));
});

function deleteUser(e) {
  return function deleteUser(ajUserDataFromServer) {
    // do the delete
  }
}

或者您可以使用Function#bind来传递活动。它的工作方式大致相同，但是，您需要修改回调以接受事件对象作为参数，而this上下文可能与您在ajax函数中的预期不同。

document.addEventListener("click", function(e) {
  getAjax("api_delete_user.php?id=" + sUserId, deleteUser.bind(this, e));
});

function deleteUser(e, ajUserDataFromServer) {
  // do the delete
}

如何使事件目标在另一个函数中可访问？

2 个答案: