JS防止浏览器自动记住密码

最近项目上做了这样一个功能,使用autocomplete="off"不能解决FF的问题,依旧会提示是否记住密码,第一次写博客,不足之处请大神们多多指点。
HTML部分:
先设置用户可以看见的密码框type为text:



添加一个隐藏的input框:


JS部分:
先判断浏览器版本
1、IE和chrome
对id="input_text_psw" 的密码框进行监听,获得焦点时,将其id = "textOrPsw"内的html改为type=“password”,提交时将id="input_text_psw"的值赋值给 id="psw"的input框;
2、其他
对id="input_text_psw" 的密码框进行监听,每输入一个字符,将用户输入的数据赋值到 id="psw"的隐藏框中,将 id="input_text_psw"的可见框使用“*”号代替;提交时将id="input_text_psw"清空。

具体代码:
HTML部分:
用户名:    
密码:    

JS部分:
$(document).ready(function(){ //阻止浏览器存储密码 if(isIE()) { if(versionFlag == "IE7" || versionFlag == "IE8" || versionFlag == "0") { $("#input_text_psw").on("focus", function() { $("#textOrPsw").html(''); $("#input_text_psw").focus(); }); }else { document.getElementById("input_text_psw").addEventListener("focus", function() {this.type = "password"; }); } $("#input_text_psw").on("focus", textForPasswordIE); }else { if(versionFlag == "Chrome") { document.getElementById("input_text_psw").addEventListener("focus", function() {this.type = "password"; }); }else { $("#input_text_psw").on("keydown", forKeydown); $("#input_text_psw").on("input", textForPassword); } } }); function isIE() { //判断浏览器版本是否为IE if (!!window.ActiveXObject || "ActiveXObject" in window) { return true; }else {return false; } }function mdFive(){//使用MD5加密 if(versionFlag == "Chrome" || isIE()) { $("#input_text_psw").val($.md5($("#input_text_psw").val())); $("#psw").val($("#input_text_psw").val()); }else{ $("#psw").val($.md5($("#psw").val())); $("#input_text_psw").val(""); } return ; }var versionFlag = ieVersion(); function ieVersion() { var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器 var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器 var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0; ") > -1 && !isIE; //判断是否IE的Edge浏览器 var isFF = userAgent.indexOf("Firefox") > -1; //判断是否Firefox浏览器 var isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") == -1; //判断是否Safari浏览器 var isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Safari") > -1; //判断Chrome浏览器if (isIE) { var reIE = /MSIE\s([0-9]+)\.[0-9]+/; reIE.test(userAgent); var fIEVersion = parseFloat(RegExp["$1"]); if(fIEVersion == 7) { return "IE7"; } else if(fIEVersion == 8) { return "IE8"; } else if(fIEVersion == 9) { return "IE9"; } else if(fIEVersion == 10) { return "IE10"; } else if(fIEVersion == 11) { return "IE11"; } else { return "0"}//IE版本过低 }//isIE endif (isFF) {return "FF"; } if (isOpera) {return "Opera"; } if (isSafari) {return "Safari"; } if (isChrome) { return "Chrome"; } if (isEdge) { return "Edge"; }}//监听keydown事件 var cursorStart = 0; var cursorEnd = 0; var inputFlag = true; var selectFlag = true; function forKeydown(){ cursorStart = $("#input_text_psw")[0].selectionStart; cursorEnd= $("#input_text_psw")[0].selectionEnd; }function textForPasswordIE() { if(versionFlag == "IE7" || versionFlag == "IE8" || versionFlag == "0") { $("#textOrPsw").html(''); $("#input_text_psw").focus(); }else{ $("#input_text_psw")[0].type = "password"; } }//使用text模拟password function textForPassword() { var loginForm = document.getElementById("forLogin"); var display_input = loginForm.pswView.value.split(""); var hide_input = loginForm.psw.value.split(""); var start = $("#input_text_psw")[0].selectionStart; var length = Math.abs( cursorEnd - cursorStart ); if(length == 0) { if(display_input.length < hide_input.length){ hide_input.splice(start,1); }else { hide_input.splice(start-1,0,display_input[start-1]); } }else { if(display_input.length < hide_input.length){ hide_input.splice(start,length); }else { hide_input.splice(start-1,length,display_input[start-1]); } } var viewPsdValuehttps://www.it610.com/article/= ""; var psdValuehttps://www.it610.com/article/= ""; for(var i = 0; i < display_input.length; i++) { viewPsdValue += "*"; } psdValue = https://www.it610.com/article/display_input.join(""); loginForm.pswView.value = https://www.it610.com/article/viewPsdValue; loginForm.psw.value = psdValue; $("#input_text_psw")[0].selectionStart = start; $("#input_text_psw")[0].selectionEnd = start; }

【JS防止浏览器自动记住密码】

    推荐阅读