所以我将我的问题浓缩成一小段 HTML 代码,供你们自己尝试。
我相信这在 Firefox 3.6 中有效,但在最近的版本中它似乎不再有效。它也不适用于 IE9 或 Firefox Nightly。
<html>
<head>
<title>Test</title>
</head>
<script type="text/javascript">
function newEvent() {
var myEvent = document.createEvent("MouseEvents");
myEvent.initEvent("click", false, false);
getElementById('Test').dispatchEvent(myEvent);
}
</script>
<body>
<form action="" onSubmit="newEvent();return false;">
<input name="OK" type="submit" value="OK" />
<input id="Test" name="Test" type="button" onClick="alert('Success!');" value="Test" />
</form>
</body>
</html>
我遇到的问题是表单正在提交到页面,而我不希望它提交。我试过“return false;”,我试过“event.preventDefault();”。如果您评论 dispatchEvent 行,其他一切都会按预期工作。我相信,由于某种原因,发送一个新事件(点击)似乎允许 onSubmit 事件继续。
您可以通过单击“确定”来测试自己,这应该触发 onSubmit。预期的行为是为“测试”按钮生成点击事件,然后 onSubmit 事件被“return false”取消;部分。
任何见解将不胜感激。
最佳答案
你的代码中遗漏了一些东西:
document.getElementById()
看第三行:
function newEvent() {
var myEvent = document.createEvent("MouseEvents");
myEvent.initEvent("click", false, false);
document.getElementById('Test').dispatchEvent(myEvent);
}
在newEvent()
中,第三行需要document.
。所以发生的事情是您收到一个错误,该错误会在 JS 到达 return false
之前停止它。
证明问题的另一种方式:
function newEvent() {
try {
var myEvent = document.createEvent("MouseEvents");
myEvent.initEvent("click", false, false);
getElementById('Test').dispatchEvent(myEvent);
} catch(e){
alert(e)
}
}
请注意,修复错误,我只是想告诉你这才是真正的问题。
关于javascript - 取消 HTML onSubmit 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8290860/