1.<input
type='button'
id='btn' onclick='check()' value="提交">
说明:只是普通的按钮(不附带提交功能),
不会触发form表单的submit()事件
,所以点击后不会提交表单
好处:
可加入js验证
,验证后若想提交可使用
document.Formname.submit()
-->js 提交函数,进行提交 Formname 为表单的name名字
若不加载提交
,利用Ajax获取数据,可实现页面不刷新,文本框内容保留
<form action='test.php' method="post" name="Form">
手机号<input type="text" name="phone">
<input type='button' id='btn' value="提交" onclick='check()'>
</form>
function check(){
js判断
document.Formname.submit();
判断后提交 Formname 为form的name document.getElementById("id").submit();也可获取,获取到form表单即可 id为form表单 id
}
2.<input
type="submit"
id='btn' value="提交" onclick='return check()'>
说明:提交按钮,点击后会触发form的onsubmit事件 提交数据实现页面跳转,进行表单处理
若想使用js验证,可在form onsubmit事件里进行返回值判定,若返回false 表单不提交 若返回ture 表单提交
<form action='test.php' method="post" name="Form" onsubmit="return check()"> 若不加return 函数返回值,则会始终提交
手机号<input type="text" name="phone">
<input type="submit" id='btn' value="提交" >
</form>
也可在按钮里面加上判断函数
<form action='test.php' method="post" name="Form" > 若不加return 函数返回值,则会始终提交
手机号<input type="text" name="phone">
<input type="submit" id='btn' value="提交" onclick="return check()" >
</form>
function check(){
return confirm('Yes or no!');
3.
<button></button>按钮
同 <input type="submit" id='btn' value="提交" >按钮效果一样