文本区域和文件输入的 jQuery 条件验证答案

【问题标题】：jQuery Conditional Validation on textarea and file inputs文本区域和文件输入的 jQuery 条件验证
【发布时间】：2016-08-29 02:16:31
【问题描述】：

我有一个带有表单的模式弹出窗口，我可以设置基本的验证代码，但是我不确定如何去做我需要的。

我有 2 个输入，一个 <textarea> 和一个 <input type="file"> 用于上传图片。我想检查其中至少一个是有效的。一个例子是......

1) 用户在文本区域添加描述但没有图像//this is fine and file upload not required

2) 用户添加文件但不添加描述//this is fine and textarea not required

3) 用户不添加任何内容，并提示填写其中之一。

提前致谢。

【问题讨论】：

您是否正在尝试做这样的事情？ jsfiddle.net/jaumzera/erpvfdhf/2
是的，但最好使用 jQuery 验证

标签： jquery html validation conditional

【解决方案1】：

这是一个fiddle 举例说明您的问题背后的一些简单逻辑。

$('#validate').click(function(){
    var text = false;
    var file = false;

    if ( $('textarea').val() != '' )
        text = true;

    if ( $('input').val() != '' )
        file = true;

    if ( !text && !file )
        alert ('Woah! Enter one of those!');
    else
        alert('I can live with one input');

});

在click 或submit 或您选择的任何事件上，查看文本区域的值和文件输入。如果该值为 false，则您知道该字段是“无效的”。如果您发现这两个字段都是“无效的”，那么您会提示您的用户输入其中一个。否则，您有“有效”的输入，可以继续执行其他操作。

请务必使用正确的选择器来应用您的代码。

【讨论】：

【解决方案2】：

HTML

<input type="file" id="text" />
<textarea id="textarea"></textarea>
<input type="button" value="ok" id="ok" />

Javascript

$(function() {
  $("#ok").click(function() {
    var $text = $("#text");
    var $textarea = $("#textarea");
    if ($text.val() == "" && $textarea.val() == "") {
      alert("fill at least one");
    }
  });
});

这是完整的小提琴：https://jsfiddle.net/erpvfdhf/3/

这里还有一个使用 jQuery Validator 的示例：jQuery Validation - Two fields, only required to fill in one

【讨论】：