Javascript 用于测试多个输入是否已完成的If语句

我有一个由3个输入字段组成的简单表单。所有输入都是必需的。我已将表单的“onsubmit”属性设置为“return validateForm（）”。在这个函数中，我执行表单验证。到目前为止，我一直在使用它，因此如果所有字段都为空，则会显示错误范围。让单个错误产生适当的字段是我遇到麻烦的部分。基本上，如果我将两个字段留空，只会出现一条错误消息。我希望这样，无论哪个字段为空，都会显示相应的错误消息

这是我的密码：

HTML:

函数返回true后，我说表单将通过contact.php文件提交，对吗

提前谢谢

function validateForm() {
  var name = $('#name').val(), email = $('#email').val(),
      message = $('#message').val();

  $('.error').hide();

  if (!name)  $("#fname").fadeIn();
  if (!email) $("#yourEmail").fadeIn();
  if (!message) $("#yourMessage").fadeIn();

  return $('.error:visible, .error:animated').length == 0;
}

它甚至可以更短、更统一

function validateForm() {
  $('.error').hide();
  $('textarea, input[type=text]').each(function() {
     if (!$(this).val())
        $(this).siblings('.error').fadeIn();    
  });
  return $('.error:visible, .error:animated').length == 0;
}

---

不要在发现问题时立即返回false——设置一个标志——返回false；阻止执行其余代码，并且不会显示错误消息

function validateForm() {
    var name = document.forms["contactForm"]["name"].value;
    var email = document.forms["contactForm"]["_replyto"].value;
    var message = document.forms["contactForm"]["message"].value;

     var allFilled = true;

if ((name == null || name == "") && (email == null || email == "") && (message == null || message == "")) {
    $(".error").show();
    allFilled =  false;
} else if (name == null || name == "") {
    $("#fname").show();
    allFilled =  false;
} else if (email == null || email == "") {
    $("#yourEmail").show();
    allFilled =  false;
} else if (message == null || message == "") {
    $("#yourMessage").show();
    allFilled =  false;
} 
return allFilled;

---

}

要回答您的问题，如果所有if子句都失败，它将命中else子句并返回true

我想提出一个改进的想法。如果（！name），则可以重写if（name==null | | name==“”）

因此：

函数validateForm（）{ var name=document.forms[“contactForm”][“name”].value； var email=document.forms[“contactForm”][“\u replyto”].value； var message=document.forms[“contactForm”][“message”]。值

---

谢谢，这真的很好。这正是我想要的。只是想知道，我现在在哪里为函数设置return true以便电子邮件发送？@Forrest我提供了更好的示例。不确定你在问什么-如果validateForm返回true，那么表单将提交到contact.php脚本。我刚刚尝试了第二个示例。如果我单击所有字段都为空的发送按钮，电子邮件错误不会出现？我在问是否需要在函数中的某个位置放置

return true

？你是说如果所有字段都正确输入，那么它会自动执行吗？抱歉，我对表单和PHP不熟悉。再次感谢。目前，如果所有字段都已完成，您必须按两次“发送”按钮。第一次，它会消除错误，然后在第二次按后，它将提交表单。是否有办法使表单立即提交？@Forrest是的，否则函数返回

未定义的
，这不是
真
，而是“more”
假
。此返回将转到在提交时返回，表单将不会被提交。我建议使用。验证jquery。如果你想的话，我做了一个小提琴。非常感谢。
function validateForm() {
  $('.error').hide();
  $('textarea, input[type=text]').each(function() {
     if (!$(this).val())
        $(this).siblings('.error').fadeIn();    
  });
  return $('.error:visible, .error:animated').length == 0;
}

function validateForm() {
    var name = document.forms["contactForm"]["name"].value;
    var email = document.forms["contactForm"]["_replyto"].value;
    var message = document.forms["contactForm"]["message"].value;

     var allFilled = true;

if ((name == null || name == "") && (email == null || email == "") && (message == null || message == "")) {
    $(".error").show();
    allFilled =  false;
} else if (name == null || name == "") {
    $("#fname").show();
    allFilled =  false;
} else if (email == null || email == "") {
    $("#yourEmail").show();
    allFilled =  false;
} else if (message == null || message == "") {
    $("#yourMessage").show();
    allFilled =  false;
} 
return allFilled;

    if (!name && !email && !message) {
        $(".error").show();
        return false;
    } else if (!name) {
        $("#fname").show();
        return false;
    } else if (!email) {
        $("#yourEmail").show();
        return false;
    } else if (!message) {
        $("#yourMessage").show();
        return false;
    } else {
        //submit form
        return true;
    }
}