Jquery 单击插件内的事件多次触发

这是我自己的插件的一个例子

• 当选择field1时，单击表1中的数据

• 当选择field2时，单击表2中的数据

• 现在，当我点击“点击我”按钮时，点击触发多个事件
  时代。 请帮忙

这是我的html代码文件index.php

<div><a href="#"  tableName="table1" id="field1">Field 1</a><br><br></div>
<div><a href="#" tableName="table2" id="field2">Field 2</a><br><br></div>

<!-- feedback of each click event -->
<div id="table">
</div>
<!-- plugin.js file code -->
<script>
        (function($){
 $.fn.jQtable = function(options){  
          var self=$(this);

          var settings = $.extend({
            tableName:'table',
          }, options );
          self.html('<a href="#" id="secondClick">Click me</a> <br>'+settings.tableName);
          $('body').on('click', '#secondClick', function(event) {
            event.preventDefault();
            alert('works!');
          });

      };
 }(jQuery));
</script>
<!-- main.js file -->
<script type="text/javascript">

$('#field1').on('click', function(event) {
    event.preventDefault();
    var self=$(this);
    var tableName=self.attr('tableName'); // get table name
$('#table').jQtable({
    tableName:tableName // send table name
});

});
$('#field2').on('click', function(event) {
    event.preventDefault();
    var self=$(this);
    var tableName=self.attr('tableName');
$('#table').jQtable({
    tableName:tableName
});

});
</script>

（函数（$）{
$.fn.jQtable=函数（选项）{
var self=$（这是）；
变量设置=$.extend({
tableName:'table'，
}，选项）；
self.html（“
”+settings.tableName）；
$（'body'）。在（'click'，'secondClick'，函数（事件）{
event.preventDefault（）；
警惕（‘工作’）；
});
};
}（jQuery））；
$（'#field1'）。在（'click'，函数（事件）{
event.preventDefault（）；
var self=$（这是）；
var tableName=self.attr（'tableName'）；//获取表名
$（“#表”）.jQtable({
tableName:tableName//发送表名
});
});
$（'#field2'）。在（'click'，函数（事件）{
event.preventDefault（）；
var self=$（这是）；
var tableName=self.attr（'tableName'）；
$（“#表”）.jQtable({
tableName:tableName
});
});

您应该将事件绑定到

self

对象，而不是

body

修改代码

self.html（'
'+settings.tableName）；
$（'.secondClick'，self）.on（'click'，函数（事件）{
event.preventDefault（）；
警惕（‘工作’）；
});

（函数（$）{
$.fn.jQtable=函数（选项）{
var self=$（这是）；
变量设置=$.extend({
tableName:'表'，
}，选项）；
self.html（“
”+settings.tableName）；
$（'.secondClick'，self）.on（'click'，函数（事件）{
event.preventDefault（）；
警惕（‘工作’）；
});
};
}（jQuery））；
$（'#field1'）。在（'click'，函数（事件）{
event.preventDefault（）；
var self=$（这是）；
var tableName=self.attr（'tableName'）；//获取表名
$（“#表”）.jQtable({
tableName:tableName//发送表名
});
});
$（'#field2'）。在（'click'，函数（事件）{
event.preventDefault（）；
var self=$（这是）；
var tableName=self.attr（'tableName'）；
$（“#表”）.jQtable({
tableName:tableName
});
});









因为这是我自己插件的一个例子，表1表2的数据来自服务器端每次调用
jQtable（）
，你都在给
#secondClick
添加一个click事件，我知道我的插件需要一个wolfb，但这就是为什么现在我点击“click me”时
按钮多次单击事件触发。
所以不，它不是。Satpal使用一些上下文提供相关答案以避免它；）好的，我需要在我的插件中每次单击都使用表名，并使用该名称获取记录。你有什么解决方案吗？？？是的，因为每次单击都需要表名，并将此名称与plugin@daulat，很高兴我能帮忙
self.html('<a href="#" class="secondClick">Click me</a> <br>' + settings.tableName);
$('.secondClick', self).on('click', function(event) {
  event.preventDefault();
  alert('works!');
});