检测输入元素的属性(类型)变化
Detect attribute(type) change of input element
如何在 java 脚本或 jquery 的检查中限制将输入类型密码更改为文本。如果有人试图在开发者菜单中打开输入类型密码元素并尝试将类型从密码更改为文本,这会使密码出现在文本框中。
如果我们可以检测到任何可能起作用的属性更改,但我不确定如果我们从开发人员菜单中进行更改是否会起作用。
这是一个有趣的问题,在 javascript 中我们没有任何直接的方法可以检测 javascript 中的类型或属性变化。我有同样的问题,然后经过一些研究,我发现这可以用 Mutation observer 来完成。
在此代码中,我为 HTMLElement 创建了一个扩展方法,我们所要做的就是获取该 HTMLElement 的引用并调用此扩展函数并传递回调,我们希望在属性更改时成为 运行。
HTMLElement.prototype.onAttributeChange = function (c) {
let observer = new MutationObserver(c);
observer.observe(this,{attributes:true});
};
var elem=document.getElementById("txtpassword");
elem.onAttributeChange(function(){
alert("attribute changed");
});
<html>
<title>
</title>
<head>
</head>
<body>
<input type="password" name="password" id="txtpassword" >
</body>
</html>
如何在 java 脚本或 jquery 的检查中限制将输入类型密码更改为文本。如果有人试图在开发者菜单中打开输入类型密码元素并尝试将类型从密码更改为文本,这会使密码出现在文本框中。
如果我们可以检测到任何可能起作用的属性更改,但我不确定如果我们从开发人员菜单中进行更改是否会起作用。
这是一个有趣的问题,在 javascript 中我们没有任何直接的方法可以检测 javascript 中的类型或属性变化。我有同样的问题,然后经过一些研究,我发现这可以用 Mutation observer 来完成。 在此代码中,我为 HTMLElement 创建了一个扩展方法,我们所要做的就是获取该 HTMLElement 的引用并调用此扩展函数并传递回调,我们希望在属性更改时成为 运行。
HTMLElement.prototype.onAttributeChange = function (c) {
let observer = new MutationObserver(c);
observer.observe(this,{attributes:true});
};
var elem=document.getElementById("txtpassword");
elem.onAttributeChange(function(){
alert("attribute changed");
});
<html>
<title>
</title>
<head>
</head>
<body>
<input type="password" name="password" id="txtpassword" >
</body>
</html>