Question

我对此代码有以下问题：

<button id="delete">Remove items</button>

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

如果单击此按钮，警报会显示两次。它不仅仅是使用这个特定的按钮，而是我创建的每一个按钮。

我做错了什么？

Answer 1

在这种情况下，我们可以执行以下操作

$('selected').unbind('click').bind('click', function (e) {
  do_something();
});

我最初触发了两次事件，当页面刷新时会触发四次。在经过谷歌搜索之后，经历了许多无效的工作。

我还必须说代码最初工作，直到我开始使用JQueryUI手风琴小部件。

Answer 2

您当前的代码有效，您可以在此处尝试：http://jsfiddle.net/s4UyH/

示例之外的其他内容会触发另一个.click()，请检查还触发该元素上的click事件的其他处理程序。

Answer 3

我也经历过的奇怪行为。所以对我来说＆＃34;返回false＆＃34;做了伎俩。

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

Answer 4

如果您使用

$( document ).ready({ })

或

$(function() { });

不止一次，点击功能会触发多次使用。

Answer 5

你可以试试这个。

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

Answer 6

我遇到了同样的问题并尝试了一切，但它没有奏效。所以我使用了以下技巧：

function do_stuff(e)
{
    if(e){ alert(e); }
}
$("#delete").click(function() {
    do_stuff("Clicked");
});

您检查该参数是否不是您的代码。因此，当第二次触发该功能时，它将显示您想要的内容。

Answer 7

$("#id").off().on("click", function() {

});

为我工作。

$("#id").off().on("click", function() {

});

Answer 8

我发现在一个多次发生的函数中绑定一个element.click会将其排队，所以下次单击它时，它会触发绑定函数执行的次数。新人错误可能在我的结束，但我希望它有所帮助。 TL，DR：确保绑定仅发生一次的设置功能的所有点击。

Answer 9

就像尼克试图说的那样，外面的东西会引发两次事件。要解决这个问题，你应该使用event.stopPropagation（）来阻止父元素冒泡。

$('button').click(function(event) {
    event.stopPropagation();
});

我希望这会有所帮助。

Answer 10

在我的情况下，我像这样使用change命令

$(document).on('change', '.select-brand', function () {...my codes...});

然后我改变了方式

$（'。select-brand'）。on（'change'，function（）{...我的代码...}）;

它解决了我的问题。

Answer 11

也可以通过将input和label都放置在具有点击监听器的元素中来。

您点击label，这会触发点击事件，并且会在input上为label再次另一个点击事件。这两个事件都与您的元素有关。

请参见此笔仅使用CSS的花键：https://codepen.io/stepanh/pen/WaYzzO

注意：这不是不是特定于jQuery的，本机侦听器被触发2次，如笔所示。

Answer 12

通常是在模板中多次有效地包含脚本时引起的。

您在同一HTML文件中多次包含了脚本
您已经使用元素上的onclick属性添加了事件监听器
如果您像template inheritance中的extends一样使用django，则很可能已将脚本包含在多个文件中，这些文件由include或{{1 }}

因此，您应该找出并删除重复的导入。这是最好的事情。

另一种解决方案是先在脚本中删除所有extend事件监听器，例如：

click

Answer 13

除非您希望您的按钮成为提交按钮，否则将其编码为删除项目那应该解决您的问题。如果未指定按钮元素的类型，则默认为提交按钮，从而导致您发现问题。

Answer 14

与Stepan的答案有关。

在我的情况下，我的"additional_path_items": [ "/path/to/add/1", "/path/to/add/2", ],侦听器中同时有input和label。

我刚刚将.click()替换为label，就可以了！

Answer 15

如果您使用的是AngularJS：

如果您使用的是AngularJS，并且您的jQuery click事件为在控制器内部，它将受到Angular框架本身的干扰，并触发两次。要解决此问题，请将其移出控制器，然后执行以下操作：

// Make sure you're using $(document), or else it won't fire.
$(document).on("click", "#myTemplateId #myButtonId", function () {
   console.log("#myButtonId is fired!");
   // Do something else.
});

angular.module("myModuleName")
   .controller("myController", bla bla bla)

jQuery Button.click（）事件被触发两次

15 个答案:

如果您使用的是AngularJS：