Jquery 如何验证样式为display:none的字段？

我有一个带有display:none属性的字段。这类似于，当用户单击yes单选按钮时，会出现文件上载字段，并且会对文件上载进行验证。在这种情况下，我使用ignore[]使验证生效，但发生的情况是，即使我单击no，也会对文件上载进行验证

这是我的密码

  <li >
   <p>
    <label for="rad">radio label:
    </label><br>
    <input type="radio" name="rad" value="yes" style="width:20px">&nbsp; Yes&nbsp;&nbsp;</input>
    <input type="radio" name="rad" value="no" style="width:20px">&nbsp; No</input><br/>
    <label for="rad" class="error" style="display:none">This field is required</label>
   </p>
    <p>
        <input type="file" name="fupl" style="display:none;margin-top:10px" id="fup"/>
        <label for="fupl" class="error" style="display:none;color:red">This field is required</label>
    </p>
</li>
<br>
<li>
    <label>checkbox label
    </label><br><br>
    <input type="checkbox" name="cb" value="tick" style="width:20px">&nbsp;&nbsp;<small>checkbox field<small></input>
    <br>
    <label for="fee" class="error" style="display:none">This field is required</label>
</li>
<br>
<li>
<input type="submit" class="button" value="SUBMIT" style="float:right"/>
</li>
<script>
        $(document).ready(function()
        {
        $("input[type='radio']").change(function(){
        if($(this).val()=="yes")
        {
        $("#fup").show();
        }
        else
        {
        $("#fup").hide();
        }
        });
        });
    </script>

---

在验证脚本中使用fup而不是fup1。

您可以在更改功能中添加文件上载规则，而不是将它们始终放在其中：

var fuplRules = {
    required: true,
    accept: 'docx|doc'
};


$("input[type='radio']").change(function () {
    if ($(this).val() == "yes") {
        $("#fup").show().rules('add', fuplRules);
    } else {
        $("#fup").hide().rules('remove');
    }
});

或者，您可以保持现在的设置方式，只需将required:true更改为required:'input[name=rad][value=yes]：checked'。这将使用所需规则的版本

工作示例1：

---

工作示例2:

fup是我的id。fupl是字段的名称。这就是我在脚本中使用它的原因。正如我所展示的，您的代码似乎已经按照您的要求执行了。但您的标题是这样的：Q：如何验证style=display:none的字段？如果不想验证隐藏字段，请删除忽略：[]选项。然后我添加了代码来隐藏字段隐藏时的错误：Yeeeep。。。。看起来我也被愚弄了。

var fuplRules = {
    required: true,
    accept: 'docx|doc'
};


$("input[type='radio']").change(function () {
    if ($(this).val() == "yes") {
        $("#fup").show().rules('add', fuplRules);
    } else {
        $("#fup").hide().rules('remove');
    }
});