【HTML】表单form中一单回车就提交的text、一点击就提交的button

来源：互联网发布：c语言中struct的用法编辑：程序博客网时间：2024/05/16 12:33

先上一段看似很简单HTML代码：

<!doctype html><html><body>    <form action="2.html" method="post">        <input type="submit" value="提交！"/>        <input type="button" value="不能提交的button!" onclick="test()"/>        <button type="button" onclick="test()">不能提交的button!</button>        <button onclick="test()">#能提交的button#</button>    </form>    <form action="2.html" method="post">        <input type="text" />    </form>    <input type="text" /></body><script>    function test(){        alert("呵呵！");    }</script></html>

在这段HTML代码中，分两部分，第一部分，在一个表单中设置4个按钮，第一个按钮，自然是无可争议，也是大家最常用的submit按钮，这个按钮学过网页编程都知道是用来提交表单的，但大家知不知道，随后3个按钮，哪个按钮能够提交表单呢？当然，答案在上面的HTML代码中已经写明白了，如果你设置的按钮，要做一些点击的Javascript(jQuery)动作或者完成一个Ajax的话，而不是提交表单的话，请用规范的<input type="button" onclick="某某javascript函数">的形式，而不是<button>，当然用<button>也是可以的，不过要加上<type="button">否则，像第1个表单的第4个按钮，点击，执行完javascript事件之后会同时提交这个表单的。除非这个button不在任意一个表单内，就仅仅执行javascript动作！这在一个复杂的后端网页编程尤为注意，因为，用循环产生表单的情况下，你有可能将某个button放在form中，没加<type="button">也没注意。

类似的情况，值得一提还有就是常见的不能再常见的文本框<input type="text" />，如果这个文本框，在一个表单内，注意到第2个表单，无须提供提交按钮，直接点一下回车就会如同点击“提交”按钮一样提交这个表单。除非这个文本框<input type="text" />不再任意一个表单之内。

估计也有一部分人不知道这个，上述代码的真实运行情况，如下图所示：

0 0