Question

我遇到过调用$ .load（）后jQuery事件触发两次的问题。事件处理程序放在load（）回调函数中，这似乎是事件在脚本上触发两次的唯一地方。

我尝试添加event.stopPropogation（）和event.preventDefault（），因为这些似乎是jQuery事件触发多个的常见建议。我不确定我的代码是不正确冒泡还是什么冒泡。任何反馈都会有所帮助。

这里是您看到行为的一些代码的摘录。

$("div.questions").load("question_source.php #simplified_a", function(){

                ...

                // Line 1
                $("#some_id").change(function(){
                    cantBeNegative(this);
                    adjusted_gross_income = $(this).val();
                    console.log(adjusted_gross_income);
                    // event.stopPropagation();
                    // event.preventDefault();
                });

你可以清楚地看到事件发生两次，控制台。我已经进入了那个位置。任何建议将不胜感激！

修改

好的，我根据一些建议检查了实时页面上的所有内容，并且肯定只有一个＆lt; div id =＆＃34;问题＆＃34;＆gt;当问题发生时存在。所以，它似乎不是一个HTML问题。

我还检查了事件是否实际被调用了两次，据我所知，事件只被调用一次。

现在，我添加了一个附加到文档的.on（）事件，该事件在动态创建的元素上调用，并且只触发一次。 .on（）不在.load（）回调中调用。这是一个在页面上其他输入框中使用的示例，它没有任何问题：

$(document).on('change', "#SWA_mothers_income", function(){
console.log("mothers income changes from on()");
});

因此，它可以正常工作，但是当在.load（）回调函数中的相同输入上进行测试时，它会触发两次，无论它是如何被调用的。所以，在我看来，它几乎肯定是.load（）的一个问题。我不会称自己为此专家，所以如果有人能解决问题，我很想知道答案。按照目前的情况，我将使用.on（）重写此代码。

第二次编辑

添加$（＆＃34;＃some_id＆＃34;）。取消绑定（＆＃39;更改＆＃39;）; 在＆＃39;更改（function（））位之前就行了！

Answer 1

添加此行

$("#some_id").unbind('change');

前

$("#some_id").change(function(){});

Answer 2

我不是说这会解决你的问题，但你需要传递参考它。

$("#some_id").change(function(event){
    cantBeNegative(this);
    adjusted_gross_income = $(this).val();
    console.log(adjusted_gross_income);
    event.stopPropagation();
    event.preventDefault();
});

Answer 3

您可能有两个带有“问题”类别的div，因此您可以将更改功能绑定两次。

如果您将更改功能更新为以下内容，则会在重新添加之前取消绑定更改事件。这将确保您只有一次绑定函数;

            $("#some_id").unbind('change').change(function(event) {
                event.preventDefault();
                cantBeNegative(this);
                adjusted_gross_income = $(this).val();
                console.log(adjusted_gross_income);
            });

在.load（）之后触发两次jQuery事件

修改

第二次编辑

3 个答案: