jQuery在.load()后触发事件两次

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

你可以清楚地看到控制台中的console.log输出了两次。任何建议都将不胜感激！

---

编辑

好的，我根据一些建议在实时页面上检查了所有内容，并且当问题发生时确实只有一个<div id="questions">存在。因此，这似乎不是HTML问题。

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

现在，我添加了一个.on()事件，附加到动态创建的元素上，它仅会触发一次。.on()没有在.load()回调函数内调用。以下是应用于页面上其他输入框的示例，它们没有任何问题:

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

这样，它可以正常工作，但是当在.load()回调函数中测试相同的输入时，它会触发两次，无论如何调用。因此，在我看来，这几乎肯定是.load()的问题。虽然我不能算是这方面的专家，但如果有人能找出问题，我很想知道答案。目前，我将使用.on()重写此代码。

---

第二个编辑

在'change(function())'之前添加 $("#some_id").unbind('change'); 就解决了问题！

- LoganEtherton

---

乍一看，您是否考虑过可能有多个class为“questions”的div？ - Sebastian Neira

你是否多次调用了这段代码，导致事件处理程序被添加了多次？ - epascarello

尝试使用return false，它可以代替stopPropagation和preventDefault的作用。 - Praveen

您正在绑定事件两次。因此它会触发两次。#some_id可能没有被.load调用替换掉。 - Kevin B

以上代码只会触发一次。这里还有其他因素，所以我们需要查看HTML。 - Reinstate Monica Cellio

Answer 1

添加这一行

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

before

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

- Hager Aly

---

哈！这就解决了问题。我想我需要研究一下unbind来找出问题所在。 - LoganEtherton

Answer 2

我并不是说这会解决你的问题，但你需要传递事件来引用它。

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

- slinky2000

Answer 3

可能你有两个class为“questions”的div，这样你可能会绑定两次change函数。

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

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

- olimortimer