1

我有一个收集 XML 的 ajax 调用,并基于该数据创建了许多 div,我在这些 div 上附加了 click() jquery 侦听器。单击时,我希望这些 div 调用一个函数并将参数传递给该函数。但是,当点击被调用时,参数的值已经改变。这是我为演示问题而构建的 jsfiddle的示例:

    $(document).ready(function() {

    function x() {

      $.ajax({
        type: "POST",
        url: "/echo/xml/",
        dataType: "xml",
        data: {
            xml: "<the>xml</the>"
        },
        success: function(xml) { 
          console.log('success');                

          $('#test').show(); 

          var text = "CORRECT";      

          $('#test').click(function() {

            insertText(text);
            console.log(text);
          });

          text = "WRONG";

        }        
      });
    }

    x();

  });

  function insertText(t) {

      $('#test').html(t);
  }

我希望文本显示为正确,而不是错误。

我知道这是一个有点复杂的例子,但我正试图在范围和正在发生的事情方面尽可能多地模拟我的实际代码。当click()基于点击调用函数时, 的值text已经改变。有没有办法在我创建它时将它的值“烘焙”text到调用中?click()我将通过循环创建其中的一些,for因为它通过 XML 运行,并且不想将所有这些数据挂到变量中以供以后使用。

4

3 回答 3

1

Like this -- you bind it to a local variable in a closure form.

(function(text){
     $('#test').click(function() {
            insertText(text);
            console.log(text);
      });
})(text);
于 2012-04-03T21:28:05.483 回答
1

click直到调用分配后才调用该text = "WRONG"函数,因此该函数当然使用text. 如您所说,如果您想text在定义时将 的值烘焙到您的函数中,则可以使用立即调用的匿名函数,如下所示:

(function(bakedText) {
  $('#test').click( function() {
    insertText(bakedText);
    console.log(bakedText);
  }
})(text);

在此处查看演示:http: //jsfiddle.net/H4DpV/

于 2012-04-03T21:29:02.097 回答
1

最简单的方法可能是创建一个附加处理程序的函数。这样,函数内的参数不变。

      var text = "CORRECT";      

      bindClick("test", text);


      // ...

      function bindClick(id, text){

          $('#' + id).click(function() {
            insertText(text);
            console.log(text);
          });
      }

http://jsfiddle.net/snTEf/2/

于 2012-04-03T21:23:23.900 回答