更改密码文本框更改的标签文本

Posted 2023-02-24

【中文标题】更改密码文本框更改的标签文本

【英文标题】：Changing label text for password textbox change

【发布时间】：2022-01-04 12:32:16

【问题描述】：

每次更改密码文本时，我都会尝试更改标签的颜色，以检查是否满足密码的所有参数（即大写字母、数字、符号等）。

我在让事件侦听器识别 onChange 或 onKeyUp 事件并运行我为它运行定义的代码时遇到问题。这是我迄今为止尝试过的：

            document.querySelector("password").AddEventListener("Change", function() 
                if (checkpw(document.querySelector("password").value)) == True) 
                    document.querySelector("pw").style.color = "#00ff00"
                else
                    document.querySelector("pw").style.color = "#ff0000"
                
            
            )

与

   <label for="password" id="pw">Password:</label> <input type="password" name="password" id="password"><br>

和

function checkpw(what) 
let sm = 0;
let lg = 0;
let num = 0;
let sym = 0;
for (let i = 0; i < what.len(); i++) 
    wstr = what.toString();
    vchr = wstr.charCodeAt(i);
    if (vchr > 40 && vchr < 127) 
        if (vchr > 47 && vchr < 58) 
            num = 1;
        else if (vchr > 64 && vchr < 91) 
            lg = 1;
        else if (vchr > 96 && vchr < 123) 
            sm = 1;
        else
            sym = 1;
        
    

if (sm && lg && num && sym) 
    return true;
else
    return false;

我尝试了几种事件监听器的变体，例如 getElementById("pw").onChange = function(), onKeyUp, onKeyDown, "KeyUp", "KeyDown"。我已经发出警报，只是为了看看它是否会在文本更改时提醒我并且我没有收到警报，所以我知道这是我在事件侦听器或查询选择器中的语法。如果有人知道我在做什么，请告诉我。提前致谢

【问题讨论】：

document.querySelector("password") 应该是 document.querySelector('[name="password"]') 或者更简单：document.getElementById('password')

谢谢，我试试

【参考方案1】：

尝试使用 'input' eventListener 而不是 'change'，它将在输入字段中的每个输入上触发事件。

field.addEventListener('input', () => 
  //do something
)

【讨论】：

谢谢，我试试