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

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

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

请指教。

谢谢。

确保并检查您是否没有意外地在HTML页面中两次包含脚本。

单击之前取消绑定；

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

这意味着您的代码两次包含了jquery脚本。但是尝试一下：

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

//your code

});

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

就我而言，我使用以下脚本克服了这个问题

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

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

只需在调用.on（）之前调用.off（）即可。

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

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

要仅删除已注册的“ click”事件处理程序，请执行以下操作：

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

解决两次点击问题的一种比较常见的方法是

e.stopPropagation()

在函数的末尾（假设您使用的function(e)是）。这样可以防止事件冒泡，否则可能导致函数的第二次执行。

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

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

对此：

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

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

请尝试这个

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

特别是在FireFox上，这绝对是一个bug。我搜索了很多上述所有答案，并最终被许多专家认为是错误。所以，我最终通过声明如下变量提出了这个想法

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);

    }
});

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

e.preventDefault();在我的职能开始时添加对我有用。

这是一个比较老的问题，但是如果您使用事件委托，这就是导致我的原因。

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

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

该代码段没有任何不好的地方。正如@karim所说，这是脚本的另一部分

就我而言，它在Chrome中运行良好，而IE则.click()两次拨打电话。如果这是您的问题，则在调用该.click()事件后，我通过返回false修复了该问题

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

打电话unbind解决了我的问题：

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

我不确定为什么，但是我遇到了这个问题

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

当我将其更改为

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

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

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

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

我在FF上也有这个问题。但是，我的标签已绑定到<a>标签。尽管该<a>标签没有移到任何地方，但仍然可以双击。我将<a>标签替换为标签，<span>双击问题消失了。

另一种选择是，如果链接没有任何作用，则完全删除href属性。

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

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

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

我的简单答案是将click绑定转换为函数，然后从元素的onclick调用该函数-很好用！而以上都不是

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

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

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

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

一个简单的解决方法是通过仅选择第一个元素来确保仅触发一次单击，例如：

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

可以肯定的是，在脚本中其他位置，“点击”事件又被绑定到同一元素，正如其他一些答案/评论所暗示的那样。

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

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

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

如果您需要快速修补程序，则其他注释者提出的使用该off方法（unbind自jQuery 3.0起不推荐使用btw ）取消绑定事件的方法，然后再重新绑定它就可以了，我也建议这样做：

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

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

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

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

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

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

希望这对某人有帮助。

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

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

我的jQuery就像这样：

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

这让我感到困惑，因为似乎什么也没有发生。问题是内部.shares toggle 抵消了外部.shares toggle。

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

安装于：

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

用。。。来代替：

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