检查是否至少一个文本字段被 jQuery 填充答案

【问题标题】：Check if at least one textfield is filled with jQuery检查是否至少一个文本字段被 jQuery 填充
【发布时间】：2023-04-10 16:14:01
【问题描述】：

我有一个 HTML 表单，提交后会发送一封邮件。我已经完成了邮件发送和其他所有工作，但是，我有一个特定的验证策略。需要填写电话号码或电子邮件字段。两者都不是必填字段，但使用 jQuery，我想至少将其中的一个设为必填。表格不得在没有电话或电子邮件的情况下提交。我是 jQuery 的新手。我的表格如下：

 <form name="myform" id="myform" role="form" method="post" action="mail.php">
    <div class="form-group">
        <label for="Phone">Phone*:</label>
        <input type="type" class="form-control" id="Phone" placeholder="Enter Phone">
        <label for="fn">First Name*:</label>
        <input type="type" class="form-control" id="fn" placeholder="Enter First Name" required>
    </div>
    <div class="form-group">
        <label for="fn">Surname:</label>
        <input type="type" class="form-control" id="fn" placeholder="Enter Surname">
        <label for="email">Email:</label>
        <input type="email" class="form-control" id="email" placeholder="Enter email">
    </div>
    <div class="form-group">
        <button type="submit" class="btn submit pull-right">Submit</button>
    </div>
</form>

【问题讨论】：

标签： javascript jquery validation

【解决方案1】：

应该这样做：

//When the form is submitted...
//Might want to give it an ID so you can bind to that instead (i.e. #myform)
$("form").submit(function() {
    //If both of them are empty...
    if($("#email").val().length === 0 && $("#Phone").val().length === 0) {
        //Notify the user.
        alert("You need to enter an email or a phone number.");
        //And do not submit the form.
        event.preventDefault();
    }
    //Here you can do other stuff related to submitting the form.
});

【讨论】：

【解决方案2】：

首先，您需要设置一个变量来存储您的结果：

var atLeastOneFilled = false;

然后，您需要浏览所有您感兴趣的字段（在本例中 - #email、#Phone）：

$('#email, #Phone').each(function(index, field) { ... });

然后，我们需要检查是否有任何字段被填写，所以在each()函数中（我放置了'...'）我们可以这样写，例如：

if($(field).val !== '')
    atLeastOneFilled = true;

这样，如果至少一个字段的值不同于“”（无），我们的标志 atLeastOneFilled 将更改为 true。

然后，你可以对你的变量做任何你想做的事：

if(atLeastOneFilled) {
    doSomething();
}

【讨论】：

【解决方案3】：

您可以使用filter：

$(function () {
  $("form").submit(function () {
    if ($("input").filter(function () {
      return $(this).val().trim().length > 0;
    }).length == 0)
      return false;
  });
});

【讨论】：

【解决方案4】：

以下条件将检查任何值是否为真

if($('#email').val() || $('#Phone').val()){
   //do your actions here.
}

【讨论】：

我是 jQuery 新手。能否请您提供更多代码？

【解决方案5】：

<script>
$( "#form" ).validate({
  rules: {
    phone: {
      require_from_group: [1, ".form-group"]
    },
    email: {
      require_from_group: [1, ".form-group"]
    }
  }
});
</script>

【讨论】：

这不是原生的 jQuery 功能；你需要一个 jQuery 插件。