Question

我正在尝试在同一个parentDiv中更新divToUpdate的值，其中在成功xhrHttpRequest时单击Button。我已将此对象作为参数传递给发送xhrHttpRequest的函数，但我无法更新div：divToUpdate

<div class="parentDiv" >
    <div class="divToUpdate" style="display:none"></div>
    <div class="btn-group">
        <button class="button" type="button" >Update</button>
    </div>
</div>
<div class="parentDiv" >
    <div class="divToUpdate" style="display:none"></div>
    <div class="btn-group">
        <button class="button" type="button">Update</button>
    </div>
</div>

JS代码（最小示例代码）

$(function()
{     
  function bindKeyPress() 
  {
    $(document).keyup(function(event) {
      switch(event.which) {
        case 37:  // left
          //do something
          break;
        case 38:  // up
          send(url,data,this);  
          break;
        }
     });
   }
});  

function send (url,data,this)
{
  var xhr = new XMLHttpRequest();
  var instance = this;
  xhr.open('POST', url, true);
  xhr.onreadystatechange = function () 
  {

    if (xhr.readyState === 4 && xhr.status === 200) 
    {
      var text = xhr.responseText;
      var jsonResponse = JSON.parse(text);
      var filename = jsonResponse.filename;
      $(instance).closest('.parentDiv').children('.divToUpdate').text(filename);
    }
  }
  xhr.send(data);
}

如何更新与单击按钮的位置对应的正确div？

Answer 1

您无法命名参数this。而是使用.call()设置所需的上下文：发送将按照您的意图定义this：

   send.call(this, url, data);  
   // ...

function send (url, data) // no this here
// ... you can use `this` here...

如果您希望点击的元素为this的值，请按以下方式调用发送：

   send.call(event.target, url, data);

如何使用“this”在xhrHttpRequest期间正确更新div

1 个答案: