Javascript 如何使用确认密码字段检查密码字段

我用javascript编写了一个函数来检查两个字段是否相同：
javascript代码：

function validate();{
var x= getElementByName("password");
var y= getElementByName("retype_password");
if(x==y) return;
else alert("password not same");

HTML代码：如何在HTML代码中调用上面编写的函数

password : <input type= "password" name="password"> <br><br>
retype password : <input type="password" name="retype_password" > <br><br>

密码：


重新键入密码：

---

提前感谢

请小心JavaScript中的方法名称。按名称拾取元素的正确方法是

document.getElementsByName

，它返回一个

NodeList

。因此，为了获得具有所需名称的第一个字段，应将结果视为数组：

function validate() {
    var x = document.getElementsByName('password')[0].value,
        y = document.getElementsByName('retype_password')[0].value;

    if (x === y) {
        return true;
    }

    alert('password not same');
    return false;
}

要使解决方案正常工作，必须将验证函数绑定为

提交事件（例如）：

或简称为：

document.getElementById('myform').addEventListener('submit', validate, false);

如果您没有表单并且使用了一些类似按钮的元素，则可以绑定单击事件，例如：

var mybutton = document.getElementById('mybutton');
mybutton.addEventListener('click', function() {
    if ( validate() ) {
        // do AJAX request or whatever...
    }
}, false);

---

请注意JavaScript中的方法名称。按名称拾取元素的正确方法是

document.getElementsByName

，它返回一个

NodeList

。因此，为了获得具有所需名称的第一个字段，应将结果视为数组：

function validate() {
    var x = document.getElementsByName('password')[0].value,
        y = document.getElementsByName('retype_password')[0].value;

    if (x === y) {
        return true;
    }

    alert('password not same');
    return false;
}

要使解决方案正常工作，必须将验证函数绑定为

提交事件（例如）：

或简称为：

document.getElementById('myform').addEventListener('submit', validate, false);

如果您没有表单并且使用了一些类似按钮的元素，则可以绑定单击事件，例如：

var mybutton = document.getElementById('mybutton');
mybutton.addEventListener('click', function() {
    if ( validate() ) {
        // do AJAX request or whatever...
    }
}, false);

---

您必须使用getElementById而不是getElementByName Javascript:

function validate() {
    var x = getElementById("password").value;
    var y = getElementById("retype_password").value;
    if(x==y) {
        return true;
    } else {
        alert("password not same");
        return false;
    }
}

<form onsubmit="return validate();"  action="submit_path" >
    <input type= "password" id="password" name="password">
    <input type= "password" id="retype_password" name="retype_password">
    <input type="submit" name="submit" value="Submit" >
</form>

和html:

function validate() {
    var x = getElementById("password").value;
    var y = getElementById("retype_password").value;
    if(x==y) {
        return true;
    } else {
        alert("password not same");
        return false;
    }
}

<form onsubmit="return validate();"  action="submit_path" >
    <input type= "password" id="password" name="password">
    <input type= "password" id="retype_password" name="retype_password">
    <input type="submit" name="submit" value="Submit" >
</form>

---

您必须使用getElementById而不是getElementByName Javascript:

function validate() {
    var x = getElementById("password").value;
    var y = getElementById("retype_password").value;
    if(x==y) {
        return true;
    } else {
        alert("password not same");
        return false;
    }
}

<form onsubmit="return validate();"  action="submit_path" >
    <input type= "password" id="password" name="password">
    <input type= "password" id="retype_password" name="retype_password">
    <input type="submit" name="submit" value="Submit" >
</form>

和html:

function validate() {
    var x = getElementById("password").value;
    var y = getElementById("retype_password").value;
    if(x==y) {
        return true;
    } else {
        alert("password not same");
        return false;
    }
}

<form onsubmit="return validate();"  action="submit_path" >
    <input type= "password" id="password" name="password">
    <input type= "password" id="retype_password" name="retype_password">
    <input type="submit" name="submit" value="Submit" >
</form>

密码：


重新键入密码：


函数验证（）{
var x=document.getElementById（“密码”）；
var y=document.getElementById（“重新键入密码”）；
如果（x.value==y.value）返回；
else警报（“密码不相同”）；
}

密码：


重新键入密码：


函数验证（）{
var x=document.getElementById（“密码”）；
var y=document.getElementById（“重新键入密码”）；
如果（x.value==y.value）返回；
else警报（“密码不相同”）；
}

来自@VisioN的右侧代码：

function validate(event) {
    var x = document.getElementsByName('password')[0].value,
        y = document.getElementsByName('retype_password')[0].value;

    if (x === y) {
        return true;
    } else {
        alert('password not same');
        event.preventDefault();
        return false;
    }
}

在提交按钮上添加一个

onclick=“validate（event）；”

属性。 （如果validate return false，请防止事件与event.preventDefault（）冒泡）

---

编辑

也许最好把它绑定到提交事件上。

---

Apolo

来自@VisioN的右侧代码：

function validate(event) {
    var x = document.getElementsByName('password')[0].value,
        y = document.getElementsByName('retype_password')[0].value;

    if (x === y) {
        return true;
    } else {
        alert('password not same');
        event.preventDefault();
        return false;
    }
}

在提交按钮上添加一个

onclick=“validate（event）；”

属性。 （如果validate return false，请防止事件与event.preventDefault（）冒泡）

---

编辑

也许最好把它绑定到提交事件上。

---

阿波罗

他们有很多方法来调用这个函数

您可以添加一个新按钮：

<input type = 'button' value = 'validate' onclick = 'validate()' />

或在文本字段的焦点不在时调用该函数：

<input type="password" name="retype_password" onblur = 'validate()'  > <br><br>

---

它们还有其他方法（onkeydown、onchange…）检查JS事件以了解更多信息：

它们有许多方法可以调用此函数

您可以添加一个新按钮：

<input type = 'button' value = 'validate' onclick = 'validate()' />

或在文本字段的焦点不在时调用该函数：

<input type="password" name="retype_password" onblur = 'validate()'  > <br><br>

---

还有其他方法（onkeydown、onchange…）检查JS事件以了解更多信息：

下面是使用类的一种更简单的方法：

password : <input type= "password" class="passwords" name="password"> <br><br>
retype password : <input type="password" class="passwords" name="retype_password" > <br><br>

---

下面是使用类的一种更简单的方法：

password : <input type= "password" class="passwords" name="password"> <br><br>
retype password : <input type="password" class="passwords" name="retype_password" > <br><br>

---

这并不能回答问题，他们想知道如何调用函数。。在形式上喜欢submit@VisioN：你纠正了JS函数，但对我来说你没有回答这个问题代码很好。但他想知道怎么称呼它。我认为他应该在提交按钮上添加一个

onclick=“validate（event）；”

属性。（如果validate return false，则使用

event.preventDefault（）；

防止事件冒泡）。所以您应该添加事件作为validate.Apolo的一个属性，并将其作为一个答案。我想这就是他想要的。虽然VisioN的添加/更改也需要在那里。@Aplo我不想添加一个按钮来确认密码。这并不能回答问题，他们想知道如何调用该函数。。在形式上喜欢submit@VisioN：你纠正了JS函数，但对我来说你没有回答这个问题代码很好。但他想知道怎么称呼它。我认为他应该在提交按钮上添加一个

onclick=“validate（event）；”

属性。（如果validate return false，则使用

event.preventDefault（）；

防止事件冒泡）。所以您应该添加事件作为validate.Apolo的一个属性，并将其作为一个答案。我想这就是他想要的。虽然VisioN的添加/更改也需要存在。@Aplo我不想添加按钮来确认密码。您需要比较两个输入的值，而不是输入本身。您需要比较两个输入的值，而不是输入本身。我不想添加按钮，我想动态勾选我刚编辑过当文本框失去焦点时进行验证我不想添加按钮，我想动态勾选我刚编辑过当文本框失去焦点时进行验证