注意,每个foreach标签内部都加一个div用来区分各个层次关系,模板代码如下:
<foreach name=‘node‘ item=‘v‘> <div class=‘a‘ align=‘center‘ style=‘padding-bottom:10px;color:#0000EE‘> {$v.title} <input type="checkbox" name=‘access[]‘ level=‘1‘ value=‘{$v.id}_1‘ <if condition=‘$v["access"]‘>checked=‘checked‘</if>> <foreach name=‘v.child‘ item=‘value‘> <div class=‘b‘> <li style=‘list-style-type:none;font-size:14px;padding-top:5px;color:#8B1A1A‘> {$value.title} <input type="checkbox" name=‘access[]‘ level=‘2‘ value=‘{$value.id}_2‘ <if condition=‘$value["access"]‘>checked=‘checked‘</if>></li> <foreach name=‘value.child‘ item=‘value1‘> <div class=‘c‘> <li style=‘list-style-type:none;font-size:13px;padding-top:5px;color:#8E8E38‘>{$value1.title} <input type="checkbox" name=‘access[]‘ level=‘3‘ value=‘{$value1.id}_3‘ <if condition=‘$value1["access"]‘>checked=‘checked‘</if>></li> </div> </foreach> </div> </foreach> </div> </foreach>
以下是jQuery代码:
<script src=‘__PUBLIC__/js/jquery-1.6.4.min.js‘></script> <script> $(function(){ $(‘[level=1]‘).click(function(){ if(this.checked){ $(this).parent().find(‘input‘).prop(‘checked‘,‘checked‘); } else{ $(this).parent().find(‘input‘).removeAttr(‘checked‘); } }); $(‘[level=2]‘).click(function(){ if (this.checked) { $(this).parent().parent().find(‘input‘).prop(‘checked‘,‘checked‘); } else{ $(this).parent().parent().find(‘input‘).removeAttr(‘checked‘); } }); }); </script>
时间: 2024-10-29 10:30:17