这两天要实现树形目录，功能中要求树形目录带checkbox，而且有默认状态，默认带勾选的，不允许取消。
YUI带checkbox的treeview是通过样式实现的，其实是不带input的，所以没办法实现disabled。选中状态其实是通过挂上高亮的class，treeview本身提供禁止高亮的功能，但一旦禁止，就显示不了勾选，所以不能使用yui的禁止高亮功能完成disabled。
写了个demo，可以模拟disabled功能。如下：
====================================================
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>阿当制作</title>
<script src="http://assets.taobaocdn.com/yui/2.7.0/build/yuiloader/yuiloader-min.js" type="text/javascript"></script>
<script type="text/javascript">
var loader = new YAHOO.util.YUILoader();
</script>
</head>
<body class="yui-skin-sam">
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/treeview/assets/skins/sam/treeview.css" />
<div id="tree" class="ygtv-checkbox">
<ul>
<li>1
<ul>
<li>1-1</li>
<li>1-2
<ul>
<li>1-2-1</li>
<li>1-2-2</li>
</ul>
</li>
</ul>
</li>
<li myid="345">2</li>
<li class="expanded">3
<ul>
<li yuiConfig='{"highlightState":1}'>02/01/2009</li>
<li>3-2</li>
</ul>
</li>
</ul>
</div>
<input type="button" value="确定" id="btn" />
<script type="text/javascript">
function init(){
var tree1 = new YAHOO.widget.TreeView("tree");
tree1.subscribe('clickEvent',tree1.onEventToggleHighlight);
tree1.setNodesProperty('propagateHighlightUp',true);
tree1.setNodesProperty('propagateHighlightDown',true);
tree1.render();
tree1.subscribe('dblClickEvent',tree1.onEventEditNode);
var hiLit = tree1.getNodesByProperty('highlightState',1);
if(YAHOO.lang.isArray(hiLit)){
for(var i=0,n=hiLit.length;i<n;i++){
hiLit[i].openFlag = true;
}
}
tree1.subscribe("highlightEvent", function(node) {
if(node.openFlag){
node.highlight();
}
});
YAHOO.util.Event.on("btn","click",function(){
var hiLit = tree1.getNodesByProperty('highlightState',1);
if(hiLit[0].isLeaf ){
alert(hiLit[0].index);
}
});
}
</script>
<script type="text/javascript">
loader.require(['dom', 'event','treeview','json']);
if(init){
loader.onSuccess = init;
}
loader.insert();
</script>
</body>
</html>
==============================================================
