【问题标题】:Unwanted autofill on html formhtml表单上不需要的自动填充
【发布时间】:2016-04-03 16:31:27
【问题描述】:

我(第一次)为网站制作登录/注册表单。对于注册表单中我要求用户提供他们的电子邮件地址的行,它提供了一个自动填充选项,这很好。问题是它还填写了下面的行,我将让用户重新输入电子邮件地址以验证它。我试过使用 autocomplete="off" 但这似乎没有影响。

我设法弄清楚,如果第二个电子邮件输入中没有“电子邮件”一词,则自动完成不会影响这一行。尽管如此, autocomplete="off" 没有影响,我不知道为什么。理想情况下,我希望以该行代码的名称发送电子邮件,以使其更易于阅读,并且将来可能会出现类似的问题。

任何想法为什么会发生这种情况?这是我的代码:

<!DOCTYPE html>
<html5>
    <head>
        <title>Login page</title>
    </head>
    <body>
        <h1>Login or Register</1h>
        <p></p>


        <div id="logindOrRegdiv">
            <input type="button" value="Login" id="login">
            <input type="button" value="Register" id="register">
        </div>

        <div id="logindiv">   
           <form name="login" autocomplete="on">
               Username<input type="text" name="userid"/><br>
               Password<input type="password" name="pswrd"/><br>
               <input type="button" onclick="check(this.form)" value="Login"/>
               <input type="reset" value="Cancel"/>
           </form>
           <script language="javascript">
               function check(form) { /*function to check userid & password*/
                   /*the following code checkes whether the entered userid and password are matching*/
                   if(form.userid.value == "myuserid" && form.pswrd.value == "mypswrd") {
                       window.open('target.html')/*opens the target page while Id & password matches*/
                   }
                   else {
                       alert("Error Password or Username")/*displays error message*/
                   }
               }
           </script>  
        </div>


        <div id="registerdiv">
            <form name="register" autocomplete="on">
                First Name<input type="text" name="firstname"/><br>
                Middle Name<input type="text" name="middlename"/><br> 
                Last Name<input type="text" name="lastname"/><br> 
                D.O.B.<input type="text" name="dob"/><br>
                Email Address<input type="email" name="email"/><br>
                Re-Type<input type="email" name="email2" autocomplete="off"/><br>
                Password<input type="password" name="password"/><br>
                Re-Type<input type="password" name="password2"/><br>
            </form>         
        </div>

        <script src="jquery-1.11.2.js"></script>

        <script src="app.js"></script>
    </body>
</html5>

【问题讨论】:

  • 如果您在第二个电子邮件输入中添加value="" 会发生什么?
  • 请告诉我,您在此表单中的密码检查与测试类似

标签: javascript html forms autocomplete textbox


【解决方案1】:

autocomplete="off" 属性在大多数主流浏览器中都有错误。

http://caniuse.com/#feat=input-autocomplete-onoff

解决方法是在每次加载页面时给name 属性一个随机值。例如name="email-jirbcea"

【讨论】:

    猜你喜欢
    • 2014-04-05
    • 2018-11-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-05-03
    • 2013-09-26
    • 2017-12-14
    • 2013-03-04
    相关资源
    最近更新 更多