javascript - 使用 JavaScript 进行表单验证始终为 true

Question

添加了更多文本，因为 stackoverflow 说代码太多

HTML

<form name="contact">
    <fieldset>
        <label class="labelone" for="naam">Naam:</label>
        <input name="naam">
        <label for="email">Email:</label>
        <input name="email">
        <label for="boodschap">Boodschap:</label>
        <textarea name="boodschap"></textarea>
    </fieldset>
    <fieldset>
        <input class="btn" type="button" onClick="valideren()" value="Verzenden" />
        <div id="resultaat"></div>
    </fieldset>
</form>

JavaScript

function valideren() {
    if (document.getElementsByName('naam').value != '' && document.getElementsByName('email').value != '' && document.getElementsByName('boodschap').value != '') {
        document.getElementById('resultaat').innerHTML = "De e-mail werd verstuurd";
    } else {
        document.getElementById('resultaat').innerHTML = "Gelieve alle velden in te vullen!";
    }
}

为什么这总是返回 true？

提前致谢!

斯蒂恩

Answer 1

如果您阅读here ，您将看到 document.getElementsByName 返回一个 NodeList，而不是单个 Node。

<强> Click for live working demo

var naam = document.getElementsByName('naam')[0].value,
    email = document.getElementsByName('email')[0].value,
    boodschap = document.getElementsByName('boodschap')[0].value,
    target = document.getElementById('resultaat');

现在:

if (naam.length && email.length && boodschap.length) {
    target.innerHTML += "valid";
} else {
    target.innerHTML += "invalid";
};