用户信息弹框在开发电商项目时，登录总会提示用户是否保存密码，很容易引起账号安全的问题，所以希望解决这个问题，禁止这个保存信息弹框最初代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .log-reg-item { /*height: 500px;*/ background: #0dbfdd; } .user-pwd-text, .user-pwd-password { margin: 0; padding: 0; border: 0; } </style></head><body><div> <!--<form id="formId" onsubmit="return false" method="post">--> <!--<input type="text" style="display:none;" />--> <!--帐号 <input type=text name="username" value=""><br/>--> <!--密码 <input type="password" name="password"/><br/>--> <!--<input type="button" class="submitBtn" value="登陆">--> <!--</form>--> <div class="log-reg-item"> <input type=text name="username" style="height: 30px;" value=""> <input type="password" name="PWD" id="PWD" maxlength="16" value="" class="text-box user-pwd-text" style="width:200px; background: #0C9A9A; height: 30px" autocomplete="off"/> </div> <div> <input type="button" class="submitBtn" value="登陆"> </div></div></body><script> document.querySelector('.submitBtn').onclick = function() { window.location.href = './index.html' }</script></html>这么写完就会弹出上图弹框解决办法原因对于type=password，浏览器会寻找与它临近的type=text，将用户名填上第一次尝试查询网上资料在<input type="password" 这个标签之前加：<input type="password" style="display:none;" /> 用于混淆浏览器<div> <!--<form id="formId" onsubmit="return false" method="post">--> <!--<input type="text" style="display:none;" />--> <!--帐号 <input type=text name="username" value=""><br/>--> <!--密码 <input type="password" name="password"/><br/>--> <!--<input type="button" class="submitBtn" value="登陆">--> <!--</form>--> <div class="log-reg-item"> <input type=text name="username" style="height: 30px;" value=""> <input type="password" name="pay-pass" id="pay-pass" maxlength="16" value="" class="text-box user-pwd-password" style="width:200px;display:none;height: 60px" autocomplete="off"/> <input type="password" name="PWD" id="PWD" maxlength="16" value="" class="text-box user-pwd-text" style="width:200px; background: #0C9A9A; height: 30px" autocomplete="off"/> </div> <div> <input type="button" class="submitBtn" value="登陆"> </div></div>还是会有弹框第二次尝试使用JavaScript控制输入框的显示隐藏<body><div> <!--<form id="formId" onsubmit="return false" method="post">--> <!--<input type="text" style="display:none;" />--> <!--帐号 <input type=text name="username" value=""><br/>--> <!--密码 <input type="password" name="password"/><br/>--> <!--<input type="button" class="submitBtn" value="登陆">--> <!--</form>--> <div class="log-reg-item"> <input type=text name="username" style="height: 30px;" value=""> <input type="text" name="pay-pass" id="pay-pass" maxlength="16" value="" class="text-box user-pwd-password" style="width:200px;display:none;height: 60px" autocomplete="off"/> <input type="password" name="PWD" id="PWD" maxlength="16" value="" class="text-box user-pwd-text" style="width:200px; background: #0C9A9A; height: 30px" autocomplete="off"/> </div> <div> <input type="button" class="submitBtn" value="登陆"> </div></div></body><script> document.querySelector('.submitBtn').onclick = function() { window.location.href = './index.html' } document.querySelector('.user-pwd-text').onfocus = function(){ this.style.display = 'none' document.querySelector('.user-pwd-password').value = '' document.querySelector('.user-pwd-password').style.display = 'block'; document.querySelector('.user-pwd-password').focus(); } document.querySelector('.user-pwd-password').onblur = function(){ // this.style.display = 'block'; this.style.display = 'none'; document.querySelector('.user-pwd-text').style.display = 'block' }</script>有时候弹，有时候不弹第三次尝试因为弹框的原因就是input的属性为password所以在第二次基础上修改，确保页面没有属性为password的input<script> document.querySelector('.submitBtn').onclick = function() { document.querySelector('.user-pwd-password').setAttribute('type', 'text') window.location.href = './index.html' } document.querySelector('.user-pwd-text').onfocus = function(){ this.style.display = 'none' document.querySelector('.user-pwd-password').value = '' document.querySelector('.user-pwd-password').style.display = 'block'; document.querySelector('.user-pwd-password').focus(); } document.querySelector('.user-pwd-password').onblur = function(){ // this.style.display = 'block'; this.style.display = 'none'; document.querySelector('.user-pwd-text').style.display = 'block' }</script>最后终于不再弹框
