如何在输入 HTML 上制作密码星号 - JavaScript

在处理密码输入时，为了保护用户的隐私，可以将用户在输入密码时实时将输入的明文字符替换为 "*" 符号。本篇文章将介绍如何在输入 HTML 上制作密码星号，并使用 JavaScript 进行实时替换。

HTML

在输入框中添加 oninput 属性，该属性会在输入框内容改变时触发相应的 JavaScript 函数。

<input type="password" oninput="showPassword()" id="password">

JavaScript

定义一个名为 showPassword() 的 JavaScript 函数，该函数将获取输入框中的文本，并使用正则表达式将其替换为 "*" 符号，最后将替换后的文本重新赋值给输入框。

function showPassword() {
  var passwordInput = document.getElementById("password");
  passwordInput.value = passwordInput.value.replace(/./g, "*");
}

此处使用了正则表达式 /./g，其中 . 表示匹配所有字符，/g 表示全局匹配。使用 "*" 将其中匹配的所有字符全部替换为 "*".

效果

加上 HTML 和 JavaScript 后，在输入密码时，所有字符均会变成星号。以下是效果演示：

以上就是如何在输入 HTML 上制作密码星号，希望可以对你有所帮助！