javascript - jquery点击事件在一次点击中执行多次

Question

我有一个模板文件，它动态包含在单个页面中的两个或多个 DIV 中:div 将如下所示: 1.查看分区 2.编辑分区 其他可以是 - RESOLUTION div ...

EDIT div 为display none 而VIEW div 出现并反转。因此，一次只能出现一个。

模板文件包含以下 javascript:

   AJS.$(document).on('click', '#addROW', function()
   {
      console.log('calling');
      ....
      ..
   }

现在，当我点击 add 按钮(存在于模板文件中)时，它会执行上面的事件，它应该添加一行并打印一条日志消息，但是，它执行双倍，所以，最初执行两次(作为包含在两个屏幕中的模板)并打印两次消息“调用”，一段时间后，它会执行两次 4 次。我希望它应该只执行一次并且只打印一次“调用”消息。

我该如何解决这个问题。

看起来是因为多次添加了 javascript.. 但我如何控制将其添加到页面中或以任何其他方式解决此问题？

谢谢

Answer 1

您可以检查脚本是否已设置以分配新事件:

AJS.$(document).on('click', '#addROW', function (event) {
    if (event.handled !== true) {
        //put your code here
        event.handled = true;
    }
    return false;
}