treeview - YUI 2.9 树视图

Question

我可以使用 YAHOO.widget.TreeView yui 2.9 渲染一棵树。使用预制

标签

<ul> <li> Products </li> </ul>

我能够使用 node.label 获得标签，即产品

YAHOO.util.Event.on('allProductSaveButton','click',function() { 

    var hiLit = rightProductTree.getNodesByProperty('highlightState',1);

    if (YAHOO.lang.isNull(hiLit)) {  

        YAHOO.log("None selected"); 

    } else { 
        var labels = []; 



        for (var i = 0; i < hiLit.length; i++) {

               var node = hiLit[i];

               if(node.children.length<=0) {

            labels.push(hiLit[i].label); }
        } 
        alert("Highlighted nodes:\n" + labels.join("\n"), "info", "example"); 
    } 
});

我想在 html 中插入产品的 id 并获取标签的 id。那么我应该在哪里放置 id 属性

还是在哪里？

Answer 1

我不确定您是否可以id在标记上设置自己的。TreeView 是 YUI 2 中最古老的小部件之一，它使用了一个特别有趣的标记，因为当时支持的 CSS 样式非常可悲，因此，你打算将这个有趣的标记应用id到哪个部分？

如果您想要给树节点一个标识符，以后可以使用它来检索它，那么使用自定义属性。然后，调用getNodesByProperty 将允许您通过该额外属性的值检索节点。

Answer 2

我有一个解决方案。我在 li 元素内的 span 元素内插入了 label 元素，即

 <ul>
    <li> <span> <label id="444" > Product </label> </span>
      </li>
     </ul>

然后使用 YAHOO.util.Dom 我遍历并获得了标签元素的 id 属性。

YAHOO.util.Event.on('GroupsProductSaveButton', 'click', function() {
            var hiLit = rightProductTree2.getNodesByProperty('highlightState', 1);
            if (YAHOO.lang.isNull(hiLit)) {
                alert("None selected");
            } else {
                var labels = [];

       for (var i = 0; i < hiLit.length; i++) {

               var node = hiLit[i];

               if(node.children.length<=0) {                
                       labels.push(YAHOO.util.Dom.get(hiLit[i].contentElId).getElementsByTagName('label')[0].getAttribute("value")); }
        }  
                alert("Highlighted nodes:\n" + labels.join("\n"), "info", "example");

                ProductGroupDWR.displaySelectedNodes(labels, function(data) {

                });
            }
        });