Question

我编写了一个jQuery插件，它具有以下类似的功能：

  <h1 id="t1">title 1</h1>
  <h1 id="t2">title 2</h2>
<script>
$.fn.extend({
  test: function(opts){
    var o = { text : 'hello '};
    o = $.extend( o, opts  );
    return this.each(function(){
      var $this = $(this);
      $div = $('<div/>');
      $btn  = $('<button />').text(o.text);
      $btn.click(function(){
        $div.text(o.text);
      });
      $this.after($btn).after($div);
    });
  }
});

$('#t1').test({text:'hola '});
$('#t2').test({text:'nihao '});
</script>

我在其中动态创建了一些元素（一个按钮和一个div），并添加了一些事件绑定。在示例代码中，我有多个元素将分别使用此插件。但是我注意到当我触发事件时，我的绑定事件也会将更改应用到我在插件中创建的最后一个div。

我做错了哪里？

Answer 1

您错过了var和$div前面的$btn，并意外创建了全局变量。

jQuery插件事件绑定动态元素

1 个答案: