触发器不上负荷工作
问题描述:
$(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
的背景是,我填充不同的HTML元素当选择菜单(selectid)改变时的东西。但是,当页面首次加载时,我想要触发选择菜单,就好像它被更改一样,以便HTML元素具有内容,即使用户不更改选择菜单。
答
您可以将更改处理您的控制台登录,你已经触发了更改后。
所以你只捕获改变的那一刻起发生的事件绑定你的改变处理,而不是在这之前
所发生的代码更改到这会解决这个问题的:
$(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");
现在你有你想要的输出,因为你在触发它之前绑定了更改处理程序。
答
因为您之后附加了点击处理程序。 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层次结构;如果它们不是直接由目标元素处理,那么它们什么都不做。
- 而不是返回jQuery对象(以允许链接),.triggerHandler()返回最后一个
处理程序返回的任何值它引起执行。如果没有处理程序被触发时,
返回undefined
+0
谢谢,这是问题!我不能相信我错过了这一点。 :) – brentonstrine 2012-02-23 02:09:13
不要忘恩负义,但老实说,为了这个社区和帮助其他类似问题的人,我投票赞成ShankarSangoli的答案是正确的。他是第一个,而且比我的解释更好。 – Sander 2012-02-23 07:12:57