blocks|key|1218938|text|在这种情况下，我们可以执行以下操作|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1218939|$('selected').unbind('click').bind('click',+function+(e)+{
++do_something();
});|code-block|syntax|javascript|1218940|我让事件最初触发两次，当页面刷新时，它会触发四次。在我用谷歌搜索了几个小时之后，我才找到答案。|1218941|我还必须说，在我开始使用JQueryUI+accordion小部件之前，代码最初是有效的。|1218942|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

In that case, we can do the following

<pre><code>$('selected').unbind('click').bind('click', function (e) {
 do_something();
});
</code></pre>

I had the event firing two times initially, when the page get refreshed it fires four times. It was after many fruitless hours before I figured out with a google search.

I must also say that the code initially was working until I started using the JQueryUI accordion widget.

blocks|key|1004548|text|我也经历过奇怪的行为。所以对我来说，"return+false“做到了这一点。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1004549|++++++++$(+'#selector'+).on(+'click',+function()+{
++++++++++++//code
++++++++++++return+false;
++++++++});|code-block|syntax|javascript|1004550|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Strange behaviour which I was experienced also. So for me "return false" did the trick.

<pre><code> $( '#selector' ).on( 'click', function() {
 //code
 return false;
 });
</code></pre>

blocks|key|1219013|text|我发现，在一个函数中绑定一个多次发生的element.click会将它排入队列，所以下次单击它时，它将触发与执行绑定函数一样多的次数。新手犯的错误可能是我的错，但我希望它能有所帮助。TL，DR:确保将所有点击绑定到一个只发生一次的设置函数上。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1219014|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I've found that binding an element.click in a function that happens more than once will queue it so next time you click it, it will trigger as many times as the binding function was executed. Newcomer mistake probably on my end but I hope it helps. TL,DR: Make sure you bind all clicks on a setup function that only happens once.

blocks|key|1219047|text|如果您使用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1219048|$(+document+).ready({+})|code-block|syntax|javascript|1219049|或|1219050|$(function()+{+});|1219051|不止一次，单击函数将触发所使用的任意次数。|1219052|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

If you use

<pre><code>$( document ).ready({ })
</code></pre>

or 

<pre><code>$(function() { });
</code></pre>

more than once, the click function will trigger as many times as it is used.

blocks|key|1004683|text|你可以试试这个。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1004684|++++$('#id').off().on('click',+function()+{
++++++++//+function+body
++++});
++++$('.class').off().on('click',+function()+{
++++++++//+function+body
++++});|code-block|syntax|javascript|1004685|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

you can try this.

<pre><code> $('#id').off().on('click', function() {
 // function body
 });
 $('.class').off().on('click', function() {
 // function body
 });
</code></pre>

blocks|key|1004749|text|就像Nick想说的那样，来自外部的东西触发了两次事件。要解决这个问题，您应该使用event.stopPropagation()来防止父元素冒泡。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1004750|$('button').click(function(event)+{
++++event.stopPropagation();
});|code-block|syntax|javascript|1004751|我希望这能帮到你。|1004752|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Just like what Nick is trying to say, something from outside is triggering the event twice. To solve that you should use event.stopPropagation() to prevent the parent element from bubbling.

<pre><code>$('button').click(function(event) {
 event.stopPropagation();
});
</code></pre>

I hope this helps.

blocks|key|1219132|text|$("#id").off().on("click",+function()+{

});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1219133|对我很管用。|unstyled|1219134|$("#id").off().on("click",+function()+{

});|1219135|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|L|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|I|3|-4|5|F|7|N|8|@]|9|@]|A|$]]]|J|$]]

<pre><code>$("#id").off().on("click", function() {

});
</code></pre>

Worked for me.

<pre><code>$("#id").off().on("click", function() {

});
</code></pre>

blocks|key|1004869|text|除非你想让你的按钮成为一个提交按钮，否则就把它写成“删除项目”来解决你的问题。如果您不指定按钮元素的类型，它将默认为submit按钮，从而导致您发现的问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1004870|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Unless you want your button to be a submit button, code it as 
 Remove items
That should solve your problem.
If you do not specify the type for a button element, it will default to a submit button, leading to the problem you identified.

blocks|key|1004903|text|与斯泰潘的答案有关。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1004904|在我的例子中，我的.click()侦听器中同时包含了input和label。|offset|length|style|CODE|1004905|我刚刚把label换成了div，它起作用了！|1004906|entityMap^0|0|9|8|Q|5|W|5|0|4|5|C|3|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@$D|N|E|O|F|G]|$D|P|E|Q|F|G]|$D|R|E|S|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|T|8|@$D|U|E|V|F|G]|$D|W|E|X|F|G]]|9|@]|A|$]]|$1|J|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|K|$]]

Related to Stepan's Answer.

in my case, i have both <code>input</code> and <code>label</code> in my <code>.click()</code> listener.

i just replaced the <code>label</code> to <code>div</code>, it worked!

blocks|key|1219312|text|在做一个老项目。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1219313|我发现，当元素中有单选输入时，当单击将选择单选输入时，jQuery单击将被触发twick，因此它是Js|1219314|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

Working on an old project.
I found out that when there is a radio input in the element and when the click will select the radio input, the jQuery click will be triggered twick and so it the Js

I have the following problem with this code:

<pre><code>&lt;button id="delete"&gt;Remove items&lt;/button&gt;

$("#delete").button({
 icons: {
 primary: 'ui-icon-trash'
 }
}).click(function() {
 alert("Clicked");
});
</code></pre>

If I click this button, the alert show up two times. It's not only with this specific button but with every single button I create.

What am I doing wrong?

jQuery Button.click() event is triggered twice

jQuery

我对这段代码有以下问题：<button id="delete">Remove items</button>$("#delete").button({ icons: { primary: 'ui-icon-trash' }}).click(function() { aler...

问jQuery Button.click()事件被触发两次
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery Button.click()事件被触发两次EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery Button.click()事件被触发两次
EN