javascript - 样式密码填充输入

Question

在大多数现代浏览器中，您可以从存储的数据中填充密码。当你在某些浏览器中这样做时，我注意到输入的背景颜色发生了变化。为此，我没有改变背景颜色，而是考虑了一种不同的风格。

当浏览器填充密码字段时，如何将样式应用到密码字段？

Javascript 和 Jquery(非首选)，可以使用。

Answer 1

浏览器使用 cookie 来保存此类数据以备后用。他们甚至可能给 cookie 一个 Id 事件，当 eventId 发生时，他们运行一些 javascript/css 代码来改变页面的 View 。

您可以使用 addEventListener() 函数并根据您希望如何更改 View 以及在什么确切条件下更改它来进行自己的配置。

例如:

//if.cookie.exists => cookieFilled()

您需要了解 cookie 的工作原理，具体取决于您的后端编程语言。

Javascipt 函数改变外观，随意配置。

myInput.addEventListener("cookieFilled", function(){
 myInput.style.backgroundColor = "yellow"; //background
 myInput.style.color           = "black";  // color of the text 
 console.log(myInput.type) //should return "password" if it is a password type     
}, false);

如果您想了解更多关于 javascript 事件的信息，请参阅 here

您可以使用 dispatchEvent() 函数触发它们。