Question

$(document).ready(function(){
    console.log("1");
    $('#selectid').triggerHandler('change');
    $('#selectid').trigger('change');
    $('#selectid').change();
    console.log("2");
    $('#intervention1-form').change(function() {
        console.log('WHY DOESNT THIS HAPPEN?');
  });
});
console.log("0");

控制台输出应为：

0
1
WHY DOESNT THIS HAPPEN?
2

但相反，它只是：

0
1
2

上下文是当我更改选择菜单（selectid）时，我用不同的东西填充HTML元素。但是，当页面首次加载时，我想触发选择菜单，就像它被更改一样，这样即使用户没有更改选择菜单，HTML元素也会有内容。

Answer 1

因为您之后附加了点击处理程序。 trigger("change")执行附加到change事件的匹配元素的所有处理程序和行为。如果没有连接处理程序，则无需执行任何操作。

试试这个。

$(document).ready(function(){
    console.log("1");
    $('#intervention1-form').change(function() {
        console.log('WHY DOESNT THIS HAPPEN?');
    });
    $('#selectid').change();
    console.log("2");
});
console.log("2");

旁注：调用trigger("change")或change()方法是一样的。

.triggerHandler（）方法与.trigger（）的行为类似   以下例外：


.triggerHandler（）方法不会导致事件的默认行为（例如表单提交）。

虽然.trigger（）将对jQuery对象匹配的所有元素进行操作，但.triggerHandler（）只会影响第一个匹配的元素。

使用.triggerHandler（）创建的事件不会冒泡DOM层次结构;如果它们不是由目标元素直接处理，
  他们什么都不做。

.triggerHandler（）不返回jQuery对象（允许链接），而是返回最后一个返回的值。   处理程序导致执行。如果没有触发处理程序，则为
  返回undefined

Answer 2

在您已经触发更改后，在控制台日志中附加更改处理程序。

因此，您将只捕获从绑定更改处理程序时发生的更改事件，而不是之前发生的事件

将代码更改为此可以解决问题：

$(document).ready(function(){
    $('#intervention1-form').change(function() {
        console.log('WHY DOESNT THIS HAPPEN?');
    });
    console.log("1");
    $('#selectid').triggerHandler('change');
    $('#selectid').trigger('change');
    $('#selectid').change();
    console.log("2");
});
console.log("0");

现在你有了你想要的输出，因为你在触发它之前绑定了变换处理程序。

触发器在加载时不起作用

2 个答案: