即使侦听器函数返回false，表单仍然会被提交 [英] Form is still submitted even though listener function returns false

问题描述

 < form 
 
我试图找出为什么这个JavaScript不会停止提交表单：
 action =http://www.example.comid =form> 
< input type =text/> 
< input type =submit/> 
< / form> 
 
< script> 
 var code = function（）{
 return false; 
}; 
 var element = window.document.getElementById（form）; 
 if（element.addEventListener）{
 element.addEventListener（submit，code，false）; 
} 
< / script> 
  

除非我将下面的onsubmit属性添加到表单元素中：

 < form action =http://www.example.comid =formonsubmit =return false> 
< input type =text/> 
< input type =submit/> 
< / form> 
 
< script> 
 var code = function（）{
 return false; 
}; 
 var element = window.document.getElementById（form）; 
 if（element.addEventListener）{
 element.addEventListener（submit，code，false）; 
} 
< / script> 
  

看起来像addEventListener方法本身就应该有效。有什么想法吗？我在Mac上，在Safari，Firefox和Opera上遇到同样的结果。感谢。

解决方案

 < script> 
 var code = function（eventObject）{
 if（eventObject.preventDefault）{
 eventObject.preventDefault（）; 
} else if（window.event）/ * ie * / {
 window.event.returnValue = false; 
} 
返回true; 
}; 
 var element = window.document.getElementById（form）; 
 if（element.addEventListener）{
 element.addEventListener（submit，code，false）; 
} else if（element.attachEvent）{
 element.attachEvent（onsubmit，code）; 
} 
< / script> 
  

I'm trying to figure out why this JavaScript doesn't stop the form from being submitted:

<form action="http://www.example.com" id="form">
    <input type="text" />
    <input type="submit" />
</form>

<script>
var code = function () {
    return false;
};
var element = window.document.getElementById("form");
if (element.addEventListener) {
    element.addEventListener("submit", code, false);
}
</script>

Unless I add the following onsubmit attribute to the form element:

<form action="http://www.example.com" id="form" onsubmit="return false">
    <input type="text" />
    <input type="submit" />
</form>

<script>
var code = function () {
    return false;
};
var element = window.document.getElementById("form");
if (element.addEventListener) {
    element.addEventListener("submit", code, false);
}
</script>

Seems like the addEventListener method alone should do the trick. Any thoughts? I'm on a Mac and I'm experiencing the same result on Safari, Firefox and Opera. Thanks.

解决方案

Combined the information from the two very helpful answers into a solution that works on both Mac and PC:

<script>
var code = function (eventObject) {
    if (eventObject.preventDefault) {
        eventObject.preventDefault();
    } else if (window.event) /* for ie */ {
        window.event.returnValue = false;
    }
    return true;
};
var element = window.document.getElementById("form");
if (element.addEventListener) {
    element.addEventListener("submit", code, false);
} else if (element.attachEvent) {
    element.attachEvent("onsubmit", code);
}
</script>

这篇关于即使侦听器函数返回false，表单仍然会被提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！