Question

以下是我的表结构：

<tr class="odd">
<td class=" sorting_1">
<input id="clone1042154701" class="fileCheckAll" type="checkbox" name="clone1042154701"  checked="">
</td>
<td class="">
<input id="appName1042154701" class="fileAppName invalid" type="text" onblur="validate(this.value,1042154701)" name="appName1042154701">
<div id="error1042154701">
</td>
<tr>
<tr>

<tr class="even">
<td class=" sorting_1">
<input id="clone1042154702" class="fileCheckAll" type="checkbox" name="clone1042154702"  checked="">
</td>
<td class="">
<input id="appName1042154702" class="fileAppName invalid" type="text" onblur="validate(this.value,1042154701)" name="appName1042154701">
<div id="error1042154702">
</td>
<tr>
<tr>
.
.
.
and many more rows

在onblur事件中，我调用了一个javascript validate函数，该函数在错误时将类设置为“无效”。

现在在表单提交之前，我调用了一个javascript方法，在其中检查类的错误并返回false id错误。

if ($("[id^=appName]").hasClass("invalid")) { 
            alert("Invalid Application name");
             return false;
        }

我面临的问题是它是否验证了所有表行，而不管是否通过复选框进行检查。我只需要验证那些通过复选框检查的行。

有些人可以建议我如何继续。

Answer 1

更新了答案：我花了很长时间，但我可能已经得到了理想的结果。因此，如果您使用以下内容：

if ($(".invalid[id^=appName]").closest("tr").find("input:checked").length > 0 ) {
        alert("Invalid Application name");
        return false;
}

仅当至少有一个类invalid的元素并且在同一行中选中了复选框时，它才会发出警报。

另外，我也看一下表格，我注意到</tr>)内的tr（div和td s的一些缺失结束标记。很抱歉指出这一点，但它可能会对HTML验证产生一些影响。

＆＃13;

function validate() {

  var invalidRowCount = $(".invalid[id^=appName]").closest("tr").find("input:checked").length;


  console.log(invalidRowCount); //prints 2

  if ($(".invalid[id^=appName]").closest("tr").find("input:checked").length > 0 ) {
    alert("Invalid Application name");
    return false;
  }
}

＆＃13;

td div { display: inline }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table>
  <tr class="odd">
    <td class=" sorting_1">
      <input id="clone1042154701" class="fileCheckAll" type="checkbox" name="clone1042154701" checked="">
    </td>
    <td class="">
      <input id="appName1042154701" class="fileAppName invalid" type="text" onblur="validate(this.value,1042154701)" name="appName1042154701">
      <div id="error1042154701">invalid</div>
    </td>
  </tr>
  <tr class="even">
    <td class=" sorting_1">
      <input id="clone1042154702" class="fileCheckAll" type="checkbox" name="clone1042154702" checked="">
    </td>
    <td class="">
      <input id="appName1042154702" class="fileAppName invalid" type="text" onblur="validate(this.value,1042154701)" name="appName1042154701">
      <div id="error1042154702">invalid</div>
    </td>
  </tr>

  <tr class="odd">
    <td class=" sorting_1">
      <input id="clone1042154701new" class="fileCheckAll" type="checkbox" name="clone1042154701new" checked="">
    </td>
    <td class="">
      <input id="appName1042154701new" class="fileAppName" type="text" onblur="validate(this.value,1042154701)" name="appName1042154701">
      <div id="error1042154701new">valid</div>
    </td>
  </tr>

</table>

<br>
<button onclick="validate()">Click me</button>

＆＃13;

Answer 2

您可以使用：

$('#someId').filter(':checked');

即。使用filter方法。

如何根据选中的复选框验证表值

2 个答案: