使用jQuery验证插件进行文件上传验证

我有一个奇怪的问题。我有一个带有文件上传和其他文本区的表单。每个字段都是必需的。因此基本上，当几个字段留空时，验证工作正常，但如果且仅当文件上传留空时，表单才会提交

这是我的密码

 <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="cv" 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();
 }
});
});

---

您的代码似乎工作正常。验证插件将忽略隐藏字段。但是，当您通过单选按钮显示文件上载字段时，它将验证并显示错误消息。见：

---

您的代码：

<input type="file" name="fupl" style="display:none;margin-top:10px" id="fup"/>

演示：

---

编辑：不确定OP想要走哪条路，但是下面的演示会在文件上载字段重新隐藏时隐藏任何挂起的错误消息

$("#fup").next('label.error').hide();

---

您在上面的代码中不显示

表单

标记。谢谢，这很有效。但就像验证后不久，“文件上载”字段消失，只显示错误消息一样。我也需要显示“文件上载”字段。此外，即使我单击“否”，它也会说该字段是必需的。@lakshganga，您可以添加一个

$(“#fup”）.next（'label.error'）.hide（）；

隐藏标签。请参阅：

$(document).ready(function () {

    $('#form').validate({
        ignore: [],
        rules: {
            fupl: {
                required: true,
                accept: 'docx|doc'
            }
        }
    });

});

$("#fup").next('label.error').hide();