5 html javascript events html-select
有没有办法让HTML select元素每次以编程方式更改其选择时调用一个函数？
当使用javascript修改选择框中的当前选择时,IE和FF都不会触发'onchange'.此外,js函数改变了选择是框架的一部分,所以我无法改变它以触发onchange(),例如.
这是一个例子:
<body>
<p>
<select id="sel1" onchange="myfunction();"><option value="v1">n1</option></select>
<input type="button" onclick="test();" value="Add an option and select it." />
</p>
<script type="text/javascript">
var inc = 1;
var sel = document.getElementById('sel1');
function test() {
inc++;
var o = new Option('n'+inc, inc);
sel.options[sel.options.length] = o;
o.selected = true;
sel.selectedIndex = sel.options.length - 1;
}
function myfunction() {
document.title += '[CHANGED]';
}
</script>
</body>
有没有办法让test()调用myfunction()而不更改test()(或在按钮上添加事件)？
谢谢.
如果您可以扩展/修改框架以在更改选择选项时提供钩子/回调，那就更好了（一种方法可能是使用js的动态功能来鸭子输入它？）。
如果做不到这一点，有一个低效的解决方案 - 轮询。您可以设置一个 setTimeout/setInteval 调用来轮询所需的选择选项 dom 元素，并在检测到某些内容发生更改时触发您自己的回调。
至于你问题的答案
有没有办法让 test() 调用 myfunction() 而不更改 test() （或在按钮上添加事件）？
是的，通过使用 jquery AOP http://plugins.jquery.com/project/AOP，它提供了一个简单的解决方案。
<body>
<p>
<select id="sel1" onchange="myfunction();"><option value="v1">n1</option></select>
<input type="button" onclick="test();" value="Add an option and select it." />
</p>
<script type="text/javascript">
var inc = 1;
var sel = document.getElementById('sel1');
function test() {
inc++;
var o = new Option('n'+inc, inc);
sel.options[sel.options.length] = o;
o.selected = true;
sel.selectedIndex = sel.options.length - 1;
}
function myfunction() {
document.title += '[CHANGED]';
}
//change to aop.after if you want to call afterwards
jQuery.aop.before( {target: window, method: 'test'},
function() {
myfunctino();
}
);
</script>
</body>