T. *_*Rex 5 html javascript jquery events onchange
我有以下设置： 2 个复选框，这样当第一个被选中时，它会切换第二个的状态。第二个有一个 onchange 监听器，它应该在它发生变化时触发警报。
问题是，当我点击它时，onchange 会被触发，但是当我使用第一个改变它的状态时，事件不会被触发。
我错过了什么吗？还是 onchange 事件基本上意味着像 onclick 一样？
<!DOCTYPE html>
<html>
<body>
<form action="">
<input id='one' type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input id='two' type="checkbox" name="vehicle" value="Car" checked>I have a car
</form>
<script>
function show(){
alert(document.getElementById('two').checked);
}
document.getElementById('one').addEventListener('click', function(){
var two = document.getElementById('two');
two.checked = ! two.checked;
});
document.getElementById('two').addEventListener('change', function(){
alert("changed");
});
</script>
</body>
</html>
谢谢你的帮助:)
您正在更改一个不会触发事件的属性，您可以触发更改事件，或者单击第二个复选框。
尝试改变：
document.getElementById('one').addEventListener('click', function(){
var two = document.getElementById('two');
two.checked = ! two.checked;
});
到：
document.getElementById('one').addEventListener('click', function(){
document.getElementById('two').click()
});
另一种解决方案是触发更改事件：
document.getElementById('one').addEventListener('click', function(){
var two = document.getElementById('two');
two.checked = ! two.checked;
two.dispatchEvent('change');
});