Chrome 输入元素应具有自动完成属性

zkure5ic  于 2023-03-05  发布在  Go
关注(0)|答案(8)|浏览(165)

我在控制台中收到此消息,我无法理解,请查看

<!DOCTYPE html>
<html>
<head>
    <title>registration page</title>
        <script src="js/jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
        $('form').submit(function(event){
    "use strict";
        var valid = true,
        message = '';    
            $('.error').remove();           
   $('form input').each(function() {
        var $this = $(this);   
        if(!$this.val()) {
            message='';
            var inputName = $this.attr('name');
            valid = false;
            message += 'Please enter your ' + inputName + '\n';
            $(this).closest('div').append('<div class="error">'+message+'</div>');           
        }
})
           if(!valid){
                event.preventDefault();
        }else{
$('form').serialize()
        }
})
})
    </script>
</head>
<body>
<form>
<div>
    <label>Name</label>
    <input type="text" name="name"><br>
</div>
<div>
    <label>File</label>
    <input type="file" name="file"><br>
</div>
<div>
    <label>password</label>
    <input type="password" name="password"><br>
</div>
<button type='submit'>Submit</button>
</form>
</body>
</html>

问题是,尽管没有错误,但我一直收到此消息

[DOM] Input elements should have autocomplete attributes (suggested: "current-password"):

我已经在控制台中提供了一个谷歌链接,它将我带到(More info: goo.gl/9p2vKq)

1zmg4dgp

1zmg4dgp1#

你换吧

<input type="password" name="password">

<input type="password" name="password" autocomplete="on">

Autocomplete允许Web开发人员指定用户代理具有什么(如果有的话)权限来提供填写表单字段值的自动化帮助,以及向浏览器提供关于字段中期望的信息类型的指导。
它很强大。

von4xj4u

von4xj4u2#

关闭自动完成

您有以下格式的options for working with errors***Input元素应该有autocomplete属性***通过修改控制台抛出:

<input type="password" name="password">

*<form><input>中将autocomplete属性设置为off,其中:

  • 强制浏览器不存储任何数据
  • 禁用在会话历史记录中缓存表单数据
<input type="password" name="password" autocomplete="off">

1.防止浏览器自动填充的另一种方法是:

  • 以下建议是特定于浏览器的 *
<input type="password" name="password" autocomplete="new-password"> <!-- For Mozilla-->
<!-- or -->
<input type="password" name="password" autocomplete="current-password"> <!-- For Chrome-->
vptzau2j

vptzau2j3#

Chromium Projects' Design Documents开始:

自动完成属性帮助密码管理员推断表单中字段的用途,避免意外保存或自动填充错误数据。

您可以在需要由口令管理器管理的HTML元素上使用autocomplete属性,以自动填充其值。autocomplete属性的值取决于要向口令管理器传递有关哪个字段的详细信息。请考虑以下示例:
1.当前密码字段-autocomplete="current-password"
1.新密码字段-autocomplete="new-password"
1.信用卡字段-autocomplete="cc-number"

2g32fytz

2g32fytz4#

这是为了确保浏览器和扩展的密码管理功能可以理解您的网站的注册,登录和更改密码的形式丰富您的HTML与破折号的元数据。
这可能会帮助您https://www.chromium.org/developers/design-documents/form-styles-that-chromium-understands

wh6knrhe

wh6knrhe5#

TypeScript 3.9导致我使用自动完成--大写“C”

9njqaruj

9njqaruj6#

React with Bootstrap要求我也使用带有大写字母“C”的autoComplete。

t3irkdon

t3irkdon7#

我知道这个问题得到了回答,这是为那些想在使用“react.js”时从控制台中删除此警告消息的人准备的
只需将其添加到输入字段中

autoComplete="true"

这里是完整的

<input type="password" className="form-control" placeholder="Password" 
                          autoComplete="true"
                          name='password'
                          required={true} />
ulmd4ohb

ulmd4ohb8#

在React中,input元素可以具有自动完成属性。此属性可帮助用户更快地填写表单,尤其是在移动的设备上。此名称可能会引起混淆,因为它更像是自动填写。您可以从以下网址了解有关它的详细信息:https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill

相关问题