如果选中了复选框，我如何用必填项来验证输入字段？

Question

我已经用JSP进行了一个商店计费项目。如果我选中一个复选框，这里的功能已经完成，产品数量是必需的。如下图所示。现在，如果选中了多个复选框，那么在按下订单按钮时​​如何实现所需的文本输入？

代码：

<tr>
     <td><%=rs.getString("id")%></td>
     <td> <input type="checkbox" id="products_check" name="products" value ="<%=rs.getString("id")%>" /> </td>
  <td> <input type="text" id="item_no" name="item_no_<%=rs.getString("id")%>" />        </td>
 <td><%=rs.getString("product_name")%></td>
 <td><%=rs.getString("product_price")%></td>
 <td class="text-center" width="250">
 <a href='edit.jsp?u=<%=rs.getString("id")%>' class="btn btn-warning">Edit</a>
                            <a href='delete.jsp?d=<%=rs.getString("id")%>' class="btn btn-danger">Delete</a>
                        </td>
                    </tr>

Answer 1

这可能对您有帮助

$("input[name='products']").on("change",function(){
  if($(this).prop("checked")){
    $(this).parent().parent().find("input[type='text']").prop("required",true);
  }
  else{
    $(this).parent().parent().find("input[type='text']").prop("required",false);
  }
});

https://jsfiddle.net/fwq08r49/

Answer 2

您监视着change的输入，然后在其共享父级上获得了同级复选框。

示例：

$(".container").on("change keyup", "input", function(e) {
  var $checkbox = $(this).parents("tr").find("checkbox");

  if ($checkbox.prop("checked") && !this.value.length) {
     alert("Input required.");
  }
});

编辑： 添加了keyup事件，并将侦听器附加到父级（不会动态替换并且在运行时可用）以捕获所有事件。