jQuery验证不适用于输入数组答案

【问题标题】：jQuery validation on not working for input arrayjQuery验证不适用于输入数组
【发布时间】：2017-12-17 06:34:25
【问题描述】：

我正在尝试使用 jQuery 从我的输入数组中验证输入（姓名、年龄和工作）。但是，我的代码在提交表单时不会验证所有空输入字段，而只会验证第一行输入。请看下图：

谁能告诉我在我的 javascript 代码中做错了什么？

Javascript

function add_row()
{
    $rowno=jQuery("#employee_table tr").length;
    $rowno=$rowno+1;
    jQuery("#employee_table tr:last").after(
        "<tr id='row"+$rowno+"'>"+
            "<td><input type='text' name='names[]' placeholder='Name'></td>"+
            "<td><input type='text' name='ages[]' placeholder='Age'></td>"+
            "<td><input type='text' name='jobs[]' placeholder='Job'></td>"+
            "<td><input type='button' value='DELETE' onclick=delete_row('row"+$rowno+"')></td>"+
        "</tr>");

}
function delete_row(rowno)
{
    jQuery('#'+rowno).remove();
}

jQuery(document).ready(function() {
  jQuery("form[name='registration']").validate({
    rules: {
      'names[]': "required",
      'ages[]': "required",
      'jobs[]':"required",
    messages: {
      'names[]':{required : "Please enter your name"},
      'ages[]': {required : "Please enter your age"},
      'jobs[]': {required : "Please enter your job"},
    },
    submitHandler: function(form) {
      form.submit();
    }
  }
  });
});

HTML

<html>
    <header>
    </header>
        <body>
        <div id="wrapper">
            <div id="form_div">
             <form method="post" action="/store-detail/" name="registration">
             <center>
              <table id="employee_table" align=center>
               <tr id="row1">
                <td><input type="text" name="names[]" placeholder="Name"></td>
                <td><input type="text" name="ages[]" placeholder="Age"></td>
                <td><input type="text" name="jobs[]" placeholder="Job"></td>
               </tr>
              </table>
              </center>
              <input type="button" onclick="add_row();" value="ADD ROW">
              <input type="submit" name="submit_row" value="SUBMIT">
             </form>
            </div>
        </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.js"></script>
        </body>
</html>

【问题讨论】：

jQuery add required to input fields的可能重复
请添加一些细节 - 你如何复制这个问题？
@JinhuaWang 我附上了我遇到的错误的图片。

标签： javascript jquery html

【解决方案1】：

既然您只“需要”这些文件 - 为什么不使用 required 关键字来代替：

<input type='text' name='jobs[]' placeholder='Job' required>

这应该比导入插件要容易得多。

对于您遇到的问题 - 我怀疑是 jquery 插件的问题。您可以提出问题here。

您还可以查看stackoverflow answer 了解如何验证输入字段。

【讨论】：