Question

我在jquery中设置了一个link元素并调用了它的click事件，但click事件调用了两次，请参阅下面的jquery代码。

$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

请告知。

感谢。

Answer 1

确保并确认您没有在HTML页面中两次意外地包含您的脚本。

Answer 2

点击之前取消绑定;

$("#link_button").unbind('click');
$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

Answer 3

这意味着您的代码包含两次jquery脚本。但试试这个：

$("#btn").unbind("click").click(function(){

//your code

});

Answer 4

我试过了， e.stopImmediatePropagation(); 这似乎对我有用。

Answer 5

在我的情况下，我使用以下脚本来解决问题

$('#id').off().on('click',function(){
    //...
});

off()取消绑定绑定到#id的所有事件。如果您只想解除绑定click事件，请使用off('click')。

Answer 6

在你打电话给.on（）之前，只需打电话给.off（）。

这将删除所有事件处理程序：

$(element).off().on('click', function() {
// function body
});

仅删除已注册的“点击”事件处理程序：

$(element).off('click').on('click', function() {
// function body
});

Answer 7

两次点击问题的一个相当常见的解决方案是放

e.stopPropagation()

在你的函数结束时（假设你使用的是function(e)）。这可以防止事件冒泡，从而导致第二次执行该功能。

Answer 8

我遇到了同样的问题，但您可以尝试更改此代码

$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

到此：

$("#link_button").button();
$("#link_button").unbind("click").click(function () {
   $("#attachmentForm").slideToggle("fast");
});

对我来说，这段代码解决了这个问题。但请注意不要在HTML页面中意外包含两次脚本。我认为，如果你正确地做这两件事，你的代码将正常工作。感谢

Answer 9

请试试这个

$('#ddlSupervisor').live('change', function (e) {
    if (e.handled !== true) { //this makes event to fire only once
    getEmployeesbySupervisor();
    e.handled = true;
   }
});

Answer 10

这绝对是一个特殊的错误，而它的FireFox。我搜索了很多尝试了所有上述答案，最后得到了许多专家的错误。所以，我最终通过声明像

这样的变量来提出这个想法

var called = false;
$("#ColorPalete li").click(function() {
    if(!called)
    {
             called = true;
             setTimeout(function(){ //<-----This can be an ajax request but keep in mind to set called=false when you get response or when the function has successfully executed.
                 alert('I am called');
                 called = false;
             },3000);

    }
});

通过这种方式，它首先检查以前是否调用了函数。

Answer 11

在我的功能开始时添加e.preventDefault();为我工作。

Answer 12

这是一个较旧的问题，但是如果你使用事件委托，这就是我的原因。

删除.delegate-two后，它停止执行两次。我相信如果两位代表都出现在同一页面上，就会发生这种情况。

$('.delegate-one, .delegate-two').on('click', '.button', function() {
    /* CODE */
});

Answer 13

致电unbind解决了我的问题：

$("#btn").unbind("click").click(function() {
    // your code
});

Answer 14

在我的情况下，它在Chrome中工作正常，IE正在调用.click()两次。如果这是你的问题，那么我在调用.click()事件

后通过return false修复它

   $("#txtChat").keypress(function(event) {
        if (event.which == 13) {
            $('#btnChat').click();
            $('#txtChat').val('');
            return false;
        }
    });

Answer 15

这段代码没有任何不妥之处。这是你的脚本的另一部分，因为@karim告诉

Answer 16

我的简单回答是将click bind转换为一个函数，然后从元素的onclick中调用它 - 做了一个享受！而上述没有一个

Answer 17

我不知道为什么但是我遇到了这个问题

$(document).on("click", ".my-element", function (e) { });

当我将其更改为

时

$(".my-element").click(function () { });

问题解决了。但我的代码肯定有问题。

Answer 18

如果您的活动呼叫两次或三次或多次，这可能会有所帮助。

如果您正在使用类似的方式触发事件…

$('.js-someclass').click();

...然后注意页面上.js-someclass个元素的数量，因为它会触发所有元素的点击事件，而不仅仅是一次！

一个简单的解决方法是确保一次触发点击，by selecting just the first element，例如：

$('.js-someclass:first').click();

Answer 19

确保您脚本中其他地方的“ click”事件又被绑定到同一元素，正如其他答案/评论所暗示的那样。

我有一个类似的问题，为了验证这一点，我只是向脚本中添加了一个console.log命令，如以下代码片段所示：

$("#link_button")
    .button()
    .click(function () {
        console.log("DEBUG: sliding toggle...");
        $("#attachmentForm").slideToggle("fast");
    });

如果点击按钮后，您从浏览器的开发人员控制台中获得了类似于下图的图像（就像我所做的那样），那么您可以肯定地知道click()事件已绑定到同一按钮两次

如果您需要快速修补程序，则其他评论员建议使用off方法（自jQuery 3.0起不推荐使用btw unbind）解决方案，以便在（重新）绑定工作正常之前取消绑定事件，我也推荐它：

$("#link_button")
    .button()
    .off("click")
    .click(function () {
        $("#attachmentForm").slideToggle("fast");
    });

不幸的是，这只是一个临时补丁！解决使老板满意的问题后，您应该真正深入研究代码并解决“重复绑定”问题。

实际的解决方案当然取决于您的特定用例。以我为例，存在一个“上下文”问题。我的函数被调用是由于对文档的特定部分进行了Ajax调用的结果：重新加载整个文档实际上是在重新加载“页面”和“元素”上下文，导致事件两次绑定到元素

我对此问题的解决方案是利用jQuery one函数，该函数与on相同，不同之处在于该事件在首次调用后便自动解除绑定。对于我的用例而言，这是理想的选择，但同样，对于其他用例而言，它可能不是解决方案。

Answer 20

我遇到了这个问题，因为我的$(elem).click(function(){});脚本内嵌在设置为style="display:none;"的div中。

当css显示切换到阻止时，脚本将再次添加事件侦听器。我将脚本移动到单独的.js文件中，并且不再启动重复事件侦听器。

Answer 21

我在FF上也有这个问题。然而，我的标记绑定到<a>标记。虽然<a>标记在任何地方都没有，但仍然会进行双击。我替换了<a>代码的<span>代码，双击问题消失了。

另一种方法是，如果链接不在任何地方，则完全删除href属性。

Answer 22

我被一个匹配多个项目的选择所欺骗，因此每个项目都被点击了。 :first帮助：

$('.someClass[data-foo="'+notAlwaysUniqueID+'"]:first').click();

Answer 23

当我在带有jquery的加载页面上使用此方法时，我在设置click函数之前编写$('#obj').off('click');，因此不会出现气泡。适合我。

Answer 24

就我而言，HTML的布局如下：

<div class="share">
  <div class="wrapper">
    <div class="share">
    </div>
  </div>
</div>

我的jQuery是这样的：

jQuery('.share').toggle();

它使我困惑，因为似乎没有发生任何事情。问题是内部.share toggle会取消外.share s toggle。

Answer 25

我通过更改元素类型解决了这个问题。而不是按钮我输入，这个问题不会发生更多。

instesd of：

<button onclick="doSomthing()">click me</button>

替换为：

<input onclick="doSomthing()" value="click me">

Answer 26

有同样的问题。这对我有用 -

$('selector').once().click(function() {});

希望这有助于某人。

click（）事件在jquery中调用两次

26 个答案: