Heim > Backend-Entwicklung > PHP-Tutorial > 阻止表单提交怎么用onsubmit呢?

阻止表单提交怎么用onsubmit呢?

WBOY
Freigeben: 2016-06-23 13:13:51
Original
1327 Leute haben es durchsucht

我在表单里面直接写onsubmit="return false;"  这样可以阻止表单提交   但是我弄了一个check函数先试了一下  这样就阻止不了提交  这是为什么   我没做过内容不合法阻止表单提交的例子    我这个代码写了很多个函数  如果不合法阻止表单提交的话怎么阻止呢?一个个加上return false这句话吗?

<!DOCTYPE html><html><head>    <meta charset="utf-8">	<title>			</title>	<style type="text/css">    div input{display: inline-block;width: 200px;height: 20px;border:1px solid #ccc;}    div .span1{display: inline-block;width: 90px;height: 20px;text-align: left;margin-top: 20px;}    div #sp1,#sp2,#sp3,#sp4{display: inline-block;width: 160px;height: 20px;}	</style>	<script src="ajax.js"></script>	<script type="text/javascript">		window.onload=function(){			var oInput=document.getElementsByTagName('input');			var oIpt1=document.getElementById('ipt1');			var oIpt2=document.getElementById('ipt2');			var oIpt3=document.getElementById('ipt3');			var oIpt4=document.getElementById('ipt4');			var oSp1=document.getElementById('sp1');			var oSp2=document.getElementById('sp2');			var oSp3=document.getElementById('sp3');			var oSp4=document.getElementById('sp4');			oIpt1.value = '';			oIpt2.value = '';			$("input[type=reset]").trigger("click");			var re=/^[\w]{6,12}$/;			function check(){				return false;			};			oIpt1.onblur=function(){				if(oIpt1.value==''){					this.style.border='1px solid red';				}else{					ajax("nameajax.php?id="+oIpt1.value,function(str){					oSp1.innerHTML=str;				    })				}			}; 			oIpt2.onblur=function(){               if(oIpt2.value==''){               	this.style.border='1px solid red';               	               }else{               	  if(oIpt2.value.match(re)){               	  	oSp2.innerHTML='密码合法';               	  }else{               	  	oSp2.innerHTML='密码不合法';               	  }               }			}			oIpt3.onblur=function(){				if(oIpt3.value==''){               	this.style.border='1px solid red';               }else{               	if(oIpt2.value==oIpt3.value){               		oSp3.innerHTML='密码正确';               	}else{               		oSp3.innerHTML='密码不一致';               	}               }			};			oIpt4.onblur=function(){				if(oIpt4.value==''){					this.style.border='1px solid red';				}else{					ajax("emailajax.php?id="+oIpt4.value,function(str){					oSp4.innerHTML=str;				    })				}							};        };	</script></head><body><div>	<form action="reg.php" onsubmit="return check();" method="post">		<span class="span1">用 户 名:</span><input type="text" id="ipt1" name="username" autocomplete="off"><span id="sp1"></span><br />        <span class="span1">密  码:</span><input type="password" id="ipt2" autocomplete="off"><span id="sp2"></span><br />        <span class="span1">确认密码:</span><input type="password" id="ipt3" name="password" autocomplete="off"><span id="sp3"></span><br />        <span class="span1">邮  箱:</span><input type="text" id="ipt4"  name="email" autocomplete="off"><span id="sp4"></span><br />        <button type="submit">提交</button>	</form></div></body></html>
Nach dem Login kopieren


回复讨论(解决方案)

既然你是 onsubmit="return check();"
那么 check() 就应该有返回值呀!
你的 check 函数是怎么写的?不担心会有共享冲突吗?

把验证的代码 写到 check() 函数里面就行了 通过就是 return true; 不通过就是 return false

既然你是 onsubmit="return check();"
那么 check() 就应该有返回值呀!
你的 check 函数是怎么写的?不担心会有共享冲突吗?


这样直接return一个false不行吗

既然你是 onsubmit="return check();"
那么 check() 就应该有返回值呀!
你的 check 函数是怎么写的?不担心会有共享冲突吗?


这样简单试了一下 第一个空着不写还是能提交过去啊
function check(){
if(oIpt1.value==''){
return false;
}
};

<!DOCTYPE html><html><head>    <meta charset="utf-8">	<title>			</title>	<style type="text/css">    div input{display: inline-block;width: 200px;height: 20px;border:1px solid #ccc;}    div .span1{display: inline-block;width: 90px;height: 20px;text-align: left;margin-top: 20px;}    div #sp1,#sp2,#sp3,#sp4{display: inline-block;width: 160px;height: 20px;}	</style>	<script src="ajax.js"></script>	<script type="text/javascript">		window.onload=function(){			var oInput=document.getElementsByTagName('input');			var oIpt1=document.getElementById('ipt1');			var oIpt2=document.getElementById('ipt2');			var oIpt3=document.getElementById('ipt3');			var oIpt4=document.getElementById('ipt4');			var oSp1=document.getElementById('sp1');			var oSp2=document.getElementById('sp2');			var oSp3=document.getElementById('sp3');			var oSp4=document.getElementById('sp4');			oIpt1.value = '';			oIpt2.value = '';			$("input[type=reset]").trigger("click");			var re=/^[\w]{6,12}$/;			function check(){				//if(条件){				//	document.getElementById('form1').submit();				//}				return false;			};			oIpt1.onblur=function(){				if(oIpt1.value==''){					this.style.border='1px solid red';				}else{					ajax("nameajax.php?id="+oIpt1.value,function(str){					oSp1.innerHTML=str;				    })				}			}; 			oIpt2.onblur=function(){               if(oIpt2.value==''){               	this.style.border='1px solid red';               	               }else{               	  if(oIpt2.value.match(re)){               	  	oSp2.innerHTML='密码合法';               	  }else{               	  	oSp2.innerHTML='密码不合法';               	  }               }			}			oIpt3.onblur=function(){				if(oIpt3.value==''){               	this.style.border='1px solid red';               }else{               	if(oIpt2.value==oIpt3.value){               		oSp3.innerHTML='密码正确';               	}else{               		oSp3.innerHTML='密码不一致';               	}               }			};			oIpt4.onblur=function(){				if(oIpt4.value==''){					this.style.border='1px solid red';				}else{					ajax("emailajax.php?id="+oIpt4.value,function(str){					oSp4.innerHTML=str;				    })				}							};        };	</script></head><body><div>	<form action="reg.php" id="form1" onsubmit="return false" method="post">		<span class="span1">用 户 名:</span><input type="text" id="ipt1" name="username" autocomplete="off"><span id="sp1"></span><br />        <span class="span1">密  码:</span><input type="password" id="ipt2" autocomplete="off"><span id="sp2"></span><br />        <span class="span1">确认密码:</span><input type="password" id="ipt3" name="password" autocomplete="off"><span id="sp3"></span><br />        <span class="span1">邮  箱:</span><input type="text" id="ipt4"  name="email" autocomplete="off"><span id="sp4"></span><br />        <button type="button" onclick="check()">提交</button>	</form></div></body></html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

<!DOCTYPE html><html><head>    <meta charset="utf-8">	<title>			</title>	<style type="text/css">    div input{display: inline-block;width: 200px;height: 20px;border:1px solid #ccc;}    div .span1{display: inline-block;width: 90px;height: 20px;text-align: left;margin-top: 20px;}    div #sp1,#sp2,#sp3,#sp4{display: inline-block;width: 160px;height: 20px;}	</style>	<script src="ajax.js"></script>	<script type="text/javascript">		window.onload=function(){			var oInput=document.getElementsByTagName('input');			var oIpt1=document.getElementById('ipt1');			var oIpt2=document.getElementById('ipt2');			var oIpt3=document.getElementById('ipt3');			var oIpt4=document.getElementById('ipt4');			var oSp1=document.getElementById('sp1');			var oSp2=document.getElementById('sp2');			var oSp3=document.getElementById('sp3');			var oSp4=document.getElementById('sp4');			oIpt1.value = '';			oIpt2.value = '';			$("input[type=reset]").trigger("click");			var re=/^[\w]{6,12}$/;			function check(){				//if(条件){				//	document.getElementById('form1').submit();				//}				return false;			};			oIpt1.onblur=function(){				if(oIpt1.value==''){					this.style.border='1px solid red';				}else{					ajax("nameajax.php?id="+oIpt1.value,function(str){					oSp1.innerHTML=str;				    })				}			}; 			oIpt2.onblur=function(){               if(oIpt2.value==''){               	this.style.border='1px solid red';               	               }else{               	  if(oIpt2.value.match(re)){               	  	oSp2.innerHTML='密码合法';               	  }else{               	  	oSp2.innerHTML='密码不合法';               	  }               }			}			oIpt3.onblur=function(){				if(oIpt3.value==''){               	this.style.border='1px solid red';               }else{               	if(oIpt2.value==oIpt3.value){               		oSp3.innerHTML='密码正确';               	}else{               		oSp3.innerHTML='密码不一致';               	}               }			};			oIpt4.onblur=function(){				if(oIpt4.value==''){					this.style.border='1px solid red';				}else{					ajax("emailajax.php?id="+oIpt4.value,function(str){					oSp4.innerHTML=str;				    })				}							};        };	</script></head><body><div>	<form action="reg.php" id="form1" onsubmit="return false" method="post">		<span class="span1">用 户 名:</span><input type="text" id="ipt1" name="username" autocomplete="off"><span id="sp1"></span><br />        <span class="span1">密  码:</span><input type="password" id="ipt2" autocomplete="off"><span id="sp2"></span><br />        <span class="span1">确认密码:</span><input type="password" id="ipt3" name="password" autocomplete="off"><span id="sp3"></span><br />        <span class="span1">邮  箱:</span><input type="text" id="ipt4"  name="email" autocomplete="off"><span id="sp4"></span><br />        <button type="button" onclick="check()">提交</button>	</form></div></body></html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren


改了 不行 表单那里也改了
function check(){
if(oIpt1.value==''){
document.getElementById('form1').submit();
}
return false;
};

<!DOCTYPE html><html><head>    <meta charset="utf-8">	<title>			</title>	<style type="text/css">    div input{display: inline-block;width: 200px;height: 20px;border:1px solid #ccc;}    div .span1{display: inline-block;width: 90px;height: 20px;text-align: left;margin-top: 20px;}    div #sp1,#sp2,#sp3,#sp4{display: inline-block;width: 160px;height: 20px;}	</style>	<script src="ajax.js"></script>	<script type="text/javascript">		window.onload=function(){			var oInput=document.getElementsByTagName('input');			var oIpt1=document.getElementById('ipt1');			var oIpt2=document.getElementById('ipt2');			var oIpt3=document.getElementById('ipt3');			var oIpt4=document.getElementById('ipt4');			var oSp1=document.getElementById('sp1');			var oSp2=document.getElementById('sp2');			var oSp3=document.getElementById('sp3');			var oSp4=document.getElementById('sp4');			oIpt1.value = '';			oIpt2.value = '';			$("input[type=reset]").trigger("click");			var re=/^[\w]{6,12}$/;			function check(){				//if(条件){				//	document.getElementById('form1').submit();				//}				return false;			};			oIpt1.onblur=function(){				if(oIpt1.value==''){					this.style.border='1px solid red';				}else{					ajax("nameajax.php?id="+oIpt1.value,function(str){					oSp1.innerHTML=str;				    })				}			}; 			oIpt2.onblur=function(){               if(oIpt2.value==''){               	this.style.border='1px solid red';               	               }else{               	  if(oIpt2.value.match(re)){               	  	oSp2.innerHTML='密码合法';               	  }else{               	  	oSp2.innerHTML='密码不合法';               	  }               }			}			oIpt3.onblur=function(){				if(oIpt3.value==''){               	this.style.border='1px solid red';               }else{               	if(oIpt2.value==oIpt3.value){               		oSp3.innerHTML='密码正确';               	}else{               		oSp3.innerHTML='密码不一致';               	}               }			};			oIpt4.onblur=function(){				if(oIpt4.value==''){					this.style.border='1px solid red';				}else{					ajax("emailajax.php?id="+oIpt4.value,function(str){					oSp4.innerHTML=str;				    })				}							};        };	</script></head><body><div>	<form action="reg.php" id="form1" onsubmit="return false" method="post">		<span class="span1">用 户 名:</span><input type="text" id="ipt1" name="username" autocomplete="off"><span id="sp1"></span><br />        <span class="span1">密  码:</span><input type="password" id="ipt2" autocomplete="off"><span id="sp2"></span><br />        <span class="span1">确认密码:</span><input type="password" id="ipt3" name="password" autocomplete="off"><span id="sp3"></span><br />        <span class="span1">邮  箱:</span><input type="text" id="ipt4"  name="email" autocomplete="off"><span id="sp4"></span><br />        <button type="button" onclick="check()">提交</button>	</form></div></body></html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren



提示这个错误
Uncaught ReferenceError: $ is not defined    27行

$是你jquery没引入吧

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage