Heim  >  Artikel  >  Backend-Entwicklung  >  为什么提交用户名和密码后 点击退回按钮提交的用户名和密码还在文本框?

为什么提交用户名和密码后 点击退回按钮提交的用户名和密码还在文本框?

WBOY
WBOYOriginal
2016-06-06 20:14:501156Durchsuche

退回后就是图片里面的样子 怎样让他自动清空呢
为什么提交用户名和密码后  点击退回按钮提交的用户名和密码还在文本框?

<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">
        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}$/;
            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" 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><?php $pdo=new PDO("mysql:host=localhost;dbname=t1","root","");
$stmt=$pdo->prepare("insert into user(username,password,email) values (:username,:password,:email)");
$stmt->execute($_POST);
?></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">
        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}$/;
            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" 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><?php $pdo=new PDO("mysql:host=localhost;dbname=t1","root","");
$stmt=$pdo->prepare("insert into user(username,password,email) values (:username,:password,:email)");
$stmt->execute($_POST);
?></code>

浏览器问题吧,我之前用火狐好像也会出现这个问题。
在form里面添加
js代码添加
$("input[type=reset]").trigger("click"); //jquery提供的方法
或者遍历表单内的元素清空内容。
我这里有个链接你可以参考下http://www.cnblogs.com/shanlin/archive/2014/07/17/3850417.html

现在浏览器一般有自动保存用户名和密码的行为,可以使用js将用户名和密码设置成空:
var oIpt1=document.getElementById('ipt1');
var oIpt2=document.getElementById('ipt2');
oIpt1.value = '';
oIpt2.value = '';

使用ajax 提交登陆,只要就不会存在后退了

Stellungnahme:
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