html禁止自动填充input表单的完美解决方法

html禁止自动填充input表单的完美解决方法

浏览次数:
作者: 墨鱼
信息来源: 本站原创
更新日期: 2020-11-21 14:55:01
文章简介

提交登陆等表单时,允许记录了密码则会保存起来,且每次都会自动填充入input,我们有时候不需要自动填充,试过网上的各种方法都没能完美解决,最后终于找到解决办法,废话不多说,直接上

  • 正文开始
  • 相关阅读
  • 推荐作品

提交登陆等表单时,允许记录了密码则会保存起来,且每次都会自动填充入input,我们有时候不需要自动填充,试过网上的各种方法都没能完美解决,最后终于找到解决办法,废话不多说,直接上代码!

<form method="post" action="">
    <input type="text" name="username" readonly="readonly" id="username">
    <input type="password" name="password" readonly="readonly" id="password">
    <input type="submit" value="登录">
</form>
<script>
    setTimeout(function removeReadonly(){
        var username=document.getElementById("username");
        var password=document.getElementById("password");
        username.removeAttribute("readonly");
        password.removeAttribute("readonly");
    },1000);
</script>

思路:首先设置input为只读readonly,当页面加载完成后,浏览器不会自动填充内容,但是也不可以进行编辑。然后我们再用js的定时器延迟一段时间后移除input的只读属性readonly,输入框便可进行再次编辑!完美解决! 

帝国CMS首页模板或其他非内容模板调用新闻正文字段newstext的方法
« 上一篇 2020年11月13日
通过JS判断浏览器语言后跳转到对应语言(中文和英文)站点
下一篇 » 2020年11月24日

如本文对您有帮助,就请墨鱼抽根烟吧!