树状图中事件关联的功能的实现

<script type="text/javascript">
$(function(){
// 指定事件处理函数
$("[name=privilegeIds]").click(function(){

// 当选中或取消一个权限时，也同时选中或取消所有的下级权限
$(this).siblings("ul").find("input").attr("checked", this.checked);

// 当选中一个权限时，也要选中所有的直接上级权限
if(this.checked == true){
$(this).parents("li").children("input").attr("checked", true);
}

});
});

</script>

树状图的代码的结构如下：

<!-- 显示树状结构内容 -->
<ul id="tree">
<s:iterator value="#application.topPrivilegeList">
<li>
<input type="checkbox" name="privilegeIds" value="${id}" id="cb_${id}" <s:property value="%{id in privilegeIds ? 'checked' : ''}"/> />
<label for="cb_${id}"><span class="folder">${name}</span></label>
<ul>
<s:iterator value="children">
<li>
<input type="checkbox" name="privilegeIds" value="${id}" id="cb_${id}" <s:property value="%{id in privilegeIds ? 'checked' : ''}"/> />
<label for="cb_${id}"><span class="folder">${name}</span></label>
<ul>
<s:iterator value="children">
<li>
<input type="checkbox" name="privilegeIds" value="${id}" id="cb_${id}" <s:property value="%{id in privilegeIds ? 'checked' : ''}"/> />
<label for="cb_${id}"><span class="folder">${name}</span></label>
</li>
</s:iterator>
</ul>
</li>
</s:iterator>
</ul>
</li>
</s:iterator>
</ul>