打造基于jQuery的高性能TreeView(下)

核心提示： 这里最主要的还是node的click事件，因为他要处理的事情很多，打造基于jQuery的高性能TreeView(下)(4)，如树的展开收缩（如果子节点不存在，但是hasChildren为真，点击其他则触发配置条件的nodeonclick事件，这一切都通过前面event的源元素的class来区分点

这里最主要的还是node的click事件，因为他要处理的事情很多，如树的展开收缩（如果子节点不存在，但是hasChildren为真，同时 complete属性不为真则需要异步加载子节点，如子节点存在，但是没有Render那么就要Render）,点击checkbox要出发级联的事件和 oncheckbox事件，点击其他则触发配置条件的nodeonclick事件，这一切都通过前面event的源元素的class来区分点击的对象

01.　　function　nodeclick(e)　{
02.　　　　var　path　=　$(this).attr("tpath");//获取节点路径
03.　　　　var　et　=　e.target　||　e.srcElement;//获取事件源
04.　　　　var　item　=　getItem(path);//根据path获取节点的数据
05.　　　　//debugger;
06.　　　　if　(et.tagName　==　"IMG")　{
07.　　　　　　　　//　+号需要展开，处理加减号
08.　　　　　　　　if　($(et).hasClass("bbit-tree-elbow-plus")　||　$(et).hasClass("bbit-tree-elbow-end-plus"))　{
09.　　　　　　　　　　　　var　ul　=　$(this).next();　//"bbit-tree-node-ct"
10.　　　　　　　　　　　　if　(ul.hasClass("bbit-tree-node-ct"))　{
11.　　　　　　　　　　　　　　　　ul.show();
12.　　　　　　　　　　　　}
13.　　　　　　　　　　　　else　{
14.　　　　　　　　　　　　　　　　var　deep　=　path.split(".").length;
15.　　　　　　　　　　　　　　　　if　(item.complete)　{
16.　　　　　　　　　　　　　　　　　　　　item.ChildNodes　!=　null　&&　asnybuild(item.ChildNodes,　deep,　path,　ul,　item);
17.　　　　　　　　　　　　　　　　}
18.　　　　　　　　　　　　　　　　else　{
19.　　　　　　　　　　　　　　　　　　　　$(this).addClass("bbit-tree-node-loading");
20.　　　　　　　　　　　　　　　　　　　　asnyloadc(ul,　item,　function(data)　{
21.　　　　　　　　　　　　　　　　　　　　　　　　item.complete　=　true;
22.　　　　　　　　　　　　　　　　　　　　　　　　item.ChildNodes　=　data;
23.　　　　　　　　　　　　　　　　　　　　　　　　asnybuild(data,　deep,　path,　ul,　item);
24.　　　　　　　　　　　　　　　　　　　　});
25.　　　　　　　　　　　　　　　　}
26.　　　　　　　　　　　　}
27.　　　　　　　　　　　　if　($(et).hasClass("bbit-tree-elbow-plus"))　{
28.　　　　　　　　　　　　　　　　$(et).swapClass("bbit-tree-elbow-plus",　"bbit-tree-elbow-minus");
29.　　　　　　　　　　　　}
30.　　　　　　　　　　　　else　{
31.　　　　　　　　　　　　　　　　$(et).swapClass("bbit-tree-elbow-end-plus",　"bbit-tree-elbow-end-minus");
32.　　　　　　　　　　　　}
33.　　　　　　　　　　　　$(this).swapClass("bbit-tree-node-collapsed",　"bbit-tree-node-expanded");
34.　　　　　　　　}
35.　　　　　　　　else　if　($(et).hasClass("bbit-tree-elbow-minus")　||　$(et).hasClass("bbit-tree-elbow-end-minus"))　{　　//-　号需要收缩　　　　　　　　　　　　　　　　　　　
36.　　　　　　　　　　　　$(this).next().hide();
37.　　　　　　　　　　　　if　($(et).hasClass("bbit-tree-elbow-minus"))　{
38.　　　　　　　　　　　　　　　　$(et).swapClass("bbit-tree-elbow-minus",　"bbit-tree-elbow-plus");
39.　　　　　　　　　　　　}
40.　　　　　　　　　　　　else　{
41.　　　　　　　　　　　　　　　　$(et).swapClass("bbit-tree-elbow-end-minus",　"bbit-tree-elbow-end-plus");
42.　　　　　　　　　　　　}
43.　　　　　　　　　　　　$(this).swapClass("bbit-tree-node-expanded",　"bbit-tree-node-collapsed");
44.　　　　　　　　}
45.　　　　　　　　else　if　($(et).hasClass("bbit-tree-node-cb"))　//　点击了Checkbox
46.　　　　　　　　{
47.　　　　　　　　　　　　var　s　=　item.checkstate　!=　1　?　1　:　0;
48.　　　　　　　　　　　　var　r　=　true;
49.　　　　　　　　　　　　if　(dfop.oncheckboxclick)　{　//触发配置的函数
50.　　　　　　　　　　　　　　　　r　=　dfop.oncheckboxclick.call(et,　item,　s);
51.　　　　　　　　　　　　}
52.　　　　　　　　　　　　if　(r　!=　false)　{//如果返回值不为false，即checkbxo变化有效
53.　　　　　　　　　　　　　　　　if　(dfop.cascadecheck)　{//允许触发级联
54.　　　　　　　　　　　　　　　　　　　　//遍历
55.　　　　　　　　　　　　　　　　　　　　cascade(check,　item,　s);//则向下关联
56.　　　　　　　　　　　　　　　　　　　　//上溯
57.　　　　　　　　　　　　　　　　　　　　bubble(check,　item,　s);　//向上关联
58.　　　　　　　　　　　　　　　　}
59.　　　　　　　　　　　　　　　　else　{
60.　　　　　　　　　　　　　　　　　　　　check(item,　s,　1);//否则只管自己
61.　　　　　　　　　　　　　　　　}
62.　　　　　　　　　　　　}
63.　　　　　　　　}
64.　　　　}
65.　　　　else　{//点击到了其他地方
66.　　　　　　　　if　(dfop.citem)　{　//上一个当前节点
67.　　　　　　　　　　　　$("#"　+　id　+　"_"　+　dfop.citem.id).removeClass("bbit-tree-selected");
68.　　　　　　　　}
69.　　　　　　　　dfop.citem　=　item;//这次的当前节点
70.　　　　　　　　$(this).addClass("bbit-tree-selected");
71.　　　　　　　　if　(dfop.onnodeclick)　{
72.　　　　　　　　　　　　dfop.onnodeclick.call(this,　item);
73.　　　　　　　　}
74.　　　　}
75.}