我怎样才能在JavaScript中听表单提交事件？
我想写我自己的表单validationJavaScript库，我一直在寻找谷歌如何检测是否点击提交button，但我发现所有的代码，你必须使用onClick onSubmit="function()"在HTML中。
我想使这个JavaScript，所以我不必像添加onSubmit或onClick JavaScript的任何HTML代码。
在香草javascript中编写事件处理程序可能会让浏览器变得烦人，所以我build议使用像jquery这样的库来使它更健壮（也更容易编写）。
在jQuery中，如果你有一个这样的forms：
<form id="hello-world" action="sayhello"> <input type="submit" value="Hello!"> </form>
你可以像这样附加一个事件处理程序：
$('#hello-world').submit(function(ev) { ev.preventDefault(); // to stop the form from submitting /* Validations go here */ this.submit(); // If all the validations succeeded });
为什么人们在没有必要时总是使用jQuery？
为什么人们不能使用简单的JavaScript？
var ele = /*Your Form Element*/; if(ele.addEventListener){ ele.addEventListener("submit", callback, false); //Modern browsers }else if(ele.attachEvent){ ele.attachEvent('onsubmit', callback); //Old IE }
callback函数是您要在提交表单时调用的函数。
关于EventTarget.addEventListener ，请查看MDN上的这个文档 。
要取消本机submit事件（防止提交表单），请在callback函数中使用.preventDefault()
document.querySelector("#myForm").addEventListener("submit", function(e){ if(!isValid){ e.preventDefault(); //stop form from submitting } });
用库监听submit事件
如果由于某种原因，您决定使用一个库（您已经使用了一个，或者您不想处理跨浏览器的问题），下面列出了在公共库中收听提交事件的方法：
-
jQuery的
$(ele).submit(callback);ele是表单元素引用，callback是callback函数引用。<iframe width="100%" height="100%" src="http://jsfiddle.net/DerekL/wnbo1hq0/show" frameborder="0"></iframe>
根据您的要求，您也可以在不使用jQuery等库的情况下执行以下操作：
把这个添加到你的头上：
window.onload = function () { document.getElementById("frmSubmit").onsubmit = function onSubmit(form) { var isValid = true; //validate your elems here isValid = false; if (!isValid) { alert("Please check your fields!"); return false; } else { //you are good to go return true; } } }
而你的表格可能仍然是这样的：
<form id="frmSubmit" action="/Submit"> <input type="submit" value="Submit" /> </form>
这是最简单的方法，当onSubmit发生时，您可以调用自己的javascript函数。
HTML
<form> <input type="text" name="name"> <input type="submit" name="submit"> </form>
JavaScript的
window.onload = function() { var form = document.querySelector("form"); form.onsubmit = submitted.bind(form); } function submitted(event) { event.preventDefault(); }
使用jQuery：
$('form').submit(function () { // Validate here if (pass) return true; else return false; });
