快捷導(dǎo)航

選擇TreeView控件的樹(shù)狀數(shù)據(jù)節(jié)點(diǎn)的JS方法(jquery)

更新時(shí)間：2010年02月06日 16:13:23 作者：

前些日子為了提高人性化選擇樹(shù)狀權(quán)限的功能，根據(jù)樹(shù)的結(jié)構(gòu)用jquery寫了個(gè)方法。

方法要達(dá)到的效果是：“ 改變一節(jié)點(diǎn)的選中狀態(tài)時(shí)，其后代節(jié)點(diǎn)選中狀態(tài)也要跟隨當(dāng)前節(jié)點(diǎn)的選中狀態(tài)改變而改變。當(dāng)前節(jié)點(diǎn)選中時(shí)，其所有祖先節(jié)點(diǎn)也要跟著選中;如取消時(shí)，要根據(jù)其同級(jí)節(jié)點(diǎn)是否有選中時(shí)，來(lái)決定其祖先節(jié)點(diǎn)的選中狀態(tài)。”
說(shuō)明：樹(shù)是用vs的TreeView控件生成的。
如圖：

代碼如下:

復(fù)制代碼代碼如下:

 
jQuery(function(){ 
jQuery(":checkbox").click(function(){ 
var objNode = this; 
var objNodeId=objNode.id; 
var divObjId= objNodeId.substring(0,objNodeId.indexOf("CheckBox")) < /span>+ "Nodes"; 
jQuery('#'+divObjId+' input[type="checkbox"]').each(function(){ 
this.checked=objNode.checked; 
} 
); 
jQuery("#"+objNodeId).parents("div[id]").each(function(){ 
var divId=this.id; 
var cbId=divId.substring(0,divId.indexOf("Nodes")) + "CheckBox"; 
var cbCount=jQuery('#'+divId+' input:checked'); 
if(objNode.checked||cbCount.length==0) 
{ 
var sId=document.getElementById(cbId); 
if (sId) 
{ 
sId.checked=objNode.checked; 
} 
} 
} 
); 
}); 
}); 

您可能感興趣的文章:

相關(guān)文章

jquery中的mouseleave和mouseout的區(qū)別模仿下拉框效果
不論鼠標(biāo)指針離開(kāi)被選元素還是任何子元素，都會(huì)觸發(fā) mouseout 事件,只有在鼠標(biāo)指針離開(kāi)被選元素時(shí)，才會(huì)觸發(fā) mouseleave 事件
2012-02-02
JQuery使用$.ajax和checkbox實(shí)現(xiàn)下次不在通知功能
這篇文章主要介紹了JQuery使用$.ajax和checkbox實(shí)現(xiàn)下次不在通知功能,本文給出HTML代碼、JS代碼、和后端JAVA代碼完整示例,需要的朋友可以參考下
2015-04-04
jquery 圖片輪換效果
重寫了昨天的圖片輪換，加入了自動(dòng)切換效果，改變了布局，增強(qiáng)了可定制性，當(dāng)然，還是有點(diǎn)小小的問(wèn)題，在IE 6+,chrome,firfox3.68下測(cè)試正常運(yùn)行
2010-07-07
jQuery實(shí)現(xiàn)的超鏈接提示效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery實(shí)現(xiàn)的超鏈接提示效果,結(jié)合實(shí)例形式對(duì)比分析了jQuery實(shí)現(xiàn)的帶有l(wèi)oading動(dòng)態(tài)圖效果的提示文字以及默認(rèn)提示文字顯示效果,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
2016-09-09
BootStrap glyphicon圖標(biāo)無(wú)法顯示的解決方法
如果不注意bootstrap引入css和fonts的規(guī)范，則可能會(huì)導(dǎo)致bootstrap 在顯示glyphicon圖標(biāo)時(shí)無(wú)法正常顯示，顯示為方框。該怎么解決呢？下面小編給大家解答下
2016-09-09
jQuery 一個(gè)圖片切換的插件
B/S開(kāi)發(fā)的朋友，首頁(yè)常常需要一些新聞圖片切換的特效，鑒于jQuery良好的插件開(kāi)發(fā)機(jī)制，我也常常自己寫一些實(shí)用的小插件，這里分享一個(gè)新聞圖片切換插件
2011-10-10
Jquery Uploadify上傳帶進(jìn)度條的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)Jquery Uploadify上傳帶進(jìn)度條的簡(jiǎn)單實(shí)例進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2014-02-02
使用jquery實(shí)現(xiàn)的一個(gè)圖片延遲加載插件（含圖片延遲加載原理）
這篇文章主要介紹了使用jquery實(shí)現(xiàn)的一個(gè)圖片延遲加載插件,同時(shí)講解了圖片延遲加載的原理,還有無(wú)阻塞加載廣告的功能哦,需要的朋友可以參考下
2014-06-06
同域jQuery(跨)iframe操作DOM(實(shí)例講解)
本篇文章主要是對(duì)同域jQuery(跨)iframe操作DOM進(jìn)行了詳細(xì)的介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2013-12-12
Javascript中的異步編程規(guī)范Promises/A詳細(xì)介紹
這篇文章主要介紹了Javascript中的異步編程規(guī)范Promises/A詳細(xì)介紹,同時(shí)介紹了jQuery 中的 Deferred 和 Promises,需要的朋友可以參考下
2014-06-06