JS |
您所在的位置：网站首页 › 表单提交型属于h5类型吗 › JS |
JS
|
提交表单
使用< input > 或 < button >标签都可以定义提交按钮，只要将type属性值设置为“submit”即可，而图像按钮则是通过将 < input >的type属性值设为“image”。当单击按钮或图像按钮时，就会提交表单。 submit事件类型仅在表单内提交按钮，或者在文本框中输入文本时按回车键触发。 示例1：单击【提交】按钮后，触发submit事件，该函数禁止表单提交，而是弹出提示框 function fun(){ var t = document.getElementById("t"); alert(t.value); return false; }
示例2：调用prevetnDefault()方法阻止事件的默认行为取消表单提交 var t = document.getElementById("t"); var f = document.getElementById("form1"); f.onsubmit = function(e){ if(t.value.length event.preventDefault(); }else{ event.returnValue = false; } } }如果文本框为空，单击回车表单并不提交。 示例3：禁用回车提交表单 var t = document.getElementById("form1"); t.onkeypress = function(e){ var e = e || window.event; return e.keyCode != 13;//按下回车时，返回false }示例4：调用submit()方法提交表单,不需要提交按钮 var t = document.getElementById("t"); var f = doument.getElementById("form1"); t.onchange = function(){ f.submit(); }注意：在调用submit()方法时，不会触发submit事件，因此在调用此方法之前先要验证表单数据。 重置表单为< input >或< button >标签设置type=“reset"属性可以定义重置按钮。 重置当单击重置按钮时，表单将被重置，所有表单字段恢复为初始值。这是会触发reset事件。 示例1：单击【重置】按钮，弹出提示，恢复文本框默认值 var t = document.getElementsByTagName("input")[0]; var f = document.getElementById("form1"); f.onreset = function(e){ alert(t.value); }
提示：也可以使用form.reset()方法重置表单，这样就不需要包含重置按钮 |
注意：当表单没有包含提交按钮时，在文本框中输入文本之后，只要按回车键一样能够触发submit事件。 **特殊情况：**在< textarea >文本区中回车只会换行，不会提交表单。
示例2：当输入字符大于10个字符，取消重置操作
【本文地址】
公司简介
联系我们
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |