javascript - 如果元素发生变化，如何向每个元素添加或删除类

Question

我有一个带有 jquery-validate 和 jquery-steps 的表单。我需要检查，如果其中一个字段不为空，则必须填写同一行中的另一个字段。如您所知，必须填充类 "required" 的元素。我保留每个元素而不需要类。在进行下一步之前，必须检查是否有任何非空元素。如果至少有一个，则必须将“必需”类添加到同一行中的所有输入。例如，如果输入“name”已填写，则输入“surname”和输入“email”也必须填写。

<table bolder=1">
<thead>
<tr>
<th>Name</th>
<th>Surname</th>
<th>Email</th>
</tr>
</thead>
</table>
<tbody>
<tr>
<td>
<input class="documentCheck" type="text">
</td>
<td>
<input type="text">
</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>
<input class="documentCheck" type="text">
</td>
<td>
<input type="text">
</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>
<input class="documentCheck" type="text">
</td>
<td>
<input type="text">
</td>
<td>
<input type="text">
</td>
</tr>
</tbody></table>

在我明白我是假人之前我做了什么:Fiddle

 $(function () {
     $(".documentCheck").change(function () {
         name = $(".documentCheck").val();
         if (name.length > 0) {
             $("td").find('.req').first().addClass("required");
         }
     });
 });

提前致谢

Answer 1

这样做:

     $(document).ready(function(){
        $(".documentCheck").on('change',"td > input",function() {
             $(this).parent().siblings().children('input').addClass('required');
         });
     });

FIDDLE

已更新 FIDDLE