Question

我不知道如何在标题中正确描述我的问题，对不起，如果问题与标题问题略有不同：

对于jsp / style相关问题，对于每个div（Polymer＆＃39; paper-button），我必须创建一个隐藏的复选框。

<%int i; %>
<form ACTION="Computation.jsp">
        <% for(i=0; i<n; i++) {%> 
            <input type="checkbox" id="ch<%=i %>" name="cid">
            <div class="paperbutton" id="pb<%=i %>">Test</div>

        <% } %>
        <input type="submit" id="sub">
</form>

我的脚本必须做的是在按下相关按钮时选中复选框：

<script>
            $(document).ready(function() {          
                   $('#pb.<%=i%>').on('click', function() {
                    if($('#ch<%=i%>').is(':checked')) {
                       $('#ch<%=i%>').prop('checked', false);
                       }
                    else { $('#ch<%=i%>').prop('checked', true);};
                   });
            });
</script>

但显然我不能用这种方式混合java和jQuery。如何仅使用jQuery执行相同的操作？

提前感谢您的帮助。

Answer 1

您可以使用各种遍历方法来查找相关的DOM元素。为简单起见，我将DIV和checkbox包装在容器div中。

HTML 的

<% for(i=0; i<n; i++) {%> 
    <div class="container">
        <input type="checkbox" name="cid">
        <div class="paperbutton" >Test</div>
    </div>
<% } %>

脚本

$(document).ready(function() {   
    //Bind event using the class provided to div       
    $('.paperbutton').on('click', function() {
        var checkbox = $(this).closest('.container').find(':checkbox');
        //var checkbox = $(this).prev(':checkbox');
        checkbox.prop('checked', !checkbox.is(':checked'));
    });
});

参考文献：

如何将一个元素绑定到另一个元素

1 个答案: