首頁 >後端開發 >php教程 >javascript - 为什么这个代码可以提交过去?

javascript - 为什么这个代码可以提交过去?

WBOY
WBOY原創
2016-06-06 20:14:39957瀏覽

一开始我是拿下面这个简短的代码做的实验 一开始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来处理的~

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn