[jquery click事件在使用类选择器时触发多次

Question

这是我的html

<li><div class="myLink" id=1>A<div>
<li><div class="myLink" id=2>b<div>
<li><div class="myLink" id=3>c<div>
<li><div class="myLink" id=4>d<div>
<li><div class="myLink" id=5>d<div>
<li><div class="myLink" id=6>e<div>
<li><div class="myLink" id=7>d<div>
<li><div class="myLink" id=8>g<div>

我使用此代码创建了一个jQuery事件绑定：

    jQuery(".myLink").click(function(event) {

         var myId = this.id;

         location.href = '/x/y?myId=' + myID;
   });

当我单击链接之一（li项）时。我以为会触发一次单击事件，当我调用this.id时，我只会得到我单击的项目的ID。

但是它看起来像是：

   jQuery(".myLink").click(function(event) {

一遍又一遍地射击，甚至以为我只是点击了一个链接。我将调试器语句放入了他们并使用了萤火虫，然后一遍又一遍地看到了这一点。

有什么想法吗？

Answer 1

如果关闭<li>标签，则可以解决此问题。我刚刚测试了它，然后更正了它。应该是

<li> ... </li>
<li> ... </li>

Answer 2

我相信大多数时候它会多次触发，这是我们如何将其置于循环中或在我们多次绑定而导致多次触发的情况下的。检查您的代码，并确保您没有多次绑定该事件。

Answer 3

我有一个类似的问题，对我来说，解决方案是在声明click事件之前先取消click事件的绑定。没什么意义，但是我不知道多个事件如何附加到单个HTML元素。 （并且我的HTML看起来有效；））

$（'。remove_lkc'）。unbind（'click'）。click（function（）{..........

Answer 4

就我而言，我有多个选项卡呈现相同的部分，并且每个部分都有$（document）.ready（）调用，该调用将click事件绑定了三次。

Answer 5

添加这两行为我解决了问题：

event.stopPropagation();
event.preventDefault();

Answer 6

尝试将id属性的值括在引号中。只需输入id=1，就会发生奇怪的事情。

而且，您怎么知道它多次发射？将此行放在函数的顶部，并查看firebug日志以查看发生了什么：

Answer 7

我的问题是，当我创建<div>时，我的事件绑定处于一个循环中，因此一遍又一遍地为事件中的每个项目添加事件。这只是需要仔细检查的内容。

就我而言，JavaScript必须与ajax请求一起呈现。

$(document).ready(function(){
    $(document).on('click','.className',function(){alert('hello..')})
});

事件多次触发。使用
。off（）

删除所有以前的事件处理程序。（使用.on（）中使用的相同签名）

$(document).ready(function(){
    $(document).off('click','.className');
    $(document).on('click','.className',function(){alert('hello..')});
});

希望对您有所帮助...

Answer 8

就我而言，JavaScript必须与ajax请求一起呈现。

$(document).ready(function(){
    $(document).on('click','.className',function(){alert('hello..')})
});

事件多次触发。使用
。off（）

Answer 9

根据发布的HTML，看起来好像myLink DIV是嵌套的，导致事件被触发多次，因为每个DIV都获得了点击。如前所述，请确保标签格式正确。每行末尾的DIV标签是否应该是结束标签？

请确保您没有多次包含js脚本。如果您在服务器站点中使用框架，请确保布局和模板不包含相同的脚本。

我相信大多数时候它会多次触发，这是我们如何将其置于循环中或在我们多次绑定而导致多次触发的情况下的。检查您的代码，并确保您没有多次绑定该事件。

in my case i have below event
--------------------------------------------------------------------
    bindSelectYesNoHeathCare = () =>
    {
        $(document).on('click', '.healthCareTypeClass', function (event)
    }

   showHideDivs = (id: number,
                    changeNavigationMenu: boolean = true,
                    loadDataFromServer:boolean = false,
                    validateHealthCareScreens = false) =>
    {
       ChildMgr.bindSelectYesNoHeathCare(); 
    }

我将其绑定到另一个事件上，在每次单击时，它再次绑定都导致触发多次。

Answer 10

请确保您没有多次包含js脚本。如果您在服务器站点中使用框架，请确保布局和模板不包含相同的脚本。