Home >Backend Development >PHP Tutorial >javascript - 为什么这个代码可以提交过去?
一开始我是拿下面这个简短的代码做的实验 一开始onsubmit="return false"是这样写的 直接return false这样阻止表单提交的 这样点击按钮没有任何反应 后来我改成函数的形式阻止表单提交 就是下面的代码的样子 改成这样别人说可以阻止表单提交 但是我试的不可以啊 点击按钮并不是一点反应没有 点击后会有页面刷新而且地址栏的地址也会变后面会多一个? 跟之前直接return false一点不一样 第二段代码也是这个情况 用onsubmit="return check()" 什么都不填 直接点提交 也可以提交到数据库里面 并不能阻止提交 谁知道我的代码哪里有问题呢 为什么不能阻止提交?
<code> <title></title> <script type="text/javascript"> function check(){ return false; } </script> <form onsubmit="return check()"> <input type="submit" value="点击表单不会提交"> </form> </code>
第二段
<code> <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" src="jquery-2.2.2.min.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'); 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> <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> </code>
一开始我是拿下面这个简短的代码做的实验 一开始onsubmit="return false"是这样写的 直接return false这样阻止表单提交的 这样点击按钮没有任何反应 后来我改成函数的形式阻止表单提交 就是下面的代码的样子 改成这样别人说可以阻止表单提交 但是我试的不可以啊 点击按钮并不是一点反应没有 点击后会有页面刷新而且地址栏的地址也会变后面会多一个? 跟之前直接return false一点不一样 第二段代码也是这个情况 用onsubmit="return check()" 什么都不填 直接点提交 也可以提交到数据库里面 并不能阻止提交 谁知道我的代码哪里有问题呢 为什么不能阻止提交?
<code> <title></title> <script type="text/javascript"> function check(){ return false; } </script> <form onsubmit="return check()"> <input type="submit" value="点击表单不会提交"> </form> </code>
第二段
<code> <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" src="jquery-2.2.2.min.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'); 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> <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> </code>
<code>function check(){ return false; };</code>
这一句不要放在window.onload里边,直接放在外层试试,我试过了可行
加断点跟踪一下吧~
return function中如果代码执行出问题 都是按照true来处理的~