的JavaScript擴展的樹狀輕量級

-1

我想要一個輕量級的解決方案，所以我發現這一個，但它只是擴展了點擊加號「+」旁邊的可擴展類的名稱。我替換了紅色的正方形和藍色的正方形，這個示例正常工作。住址代碼：http://jsfiddle.net/2VXuk/2/的JavaScript擴展的樹狀輕量級

我需要幫助修改它，使任何可擴展的子級別成爲不是鏈接的類別，並在點擊其名稱時展開其內容。

將是巨大的，有選擇，使其類別 - 擴大點擊或鏈接擴大+點擊重定向名稱點擊。例如

<ul id="sitemap"> 
<li><a class="category" href="#">expands only</a> 
    <ul> 
     <li><a href="#">Sample</a></li> 
     <li><a href="#">Sample</a></li> 
     <li><a class="category_and_link" href="psy.html">Link to page or expand on + button</a> 
      <ul> 
       <li><a href="#">Sample</a></li> 
       <li><a href="#">Sample</a></li> 
       <li><a href="#">Sample</a></li> 
       <li><a href="#">Sample</a></li> 
       <li><a href="#">Sample</a></li> 
      </ul>       
     </li> 
     <li><a href="#">Fourth link</a></li> 
     <li><a href="#">Fifth link</a></li> 
    </ul>     
</li> 
</ul> 

<script type="text/javascript"> 
this.sitemapstyler = function(){ 
    var sitemap = document.getElementById("sitemap") 
    if(sitemap){ 

     this.listItem = function(li){ 
      if(li.getElementsByTagName("ul").length > 0){ 
       var ul = li.getElementsByTagName("ul")[0]; 
       ul.style.display = "none"; 
       var span = document.createElement("span"); 
       span.className = "collapsed"; 
       span.onclick = function(){ 
        ul.style.display = (ul.style.display == "none") ? "block" : "none"; 
        this.className = (ul.style.display == "none") ? "collapsed" : "expanded"; 
       }; 
       li.appendChild(span); 
      }; 
     }; 

     var items = sitemap.getElementsByTagName("li"); 
     for(var i=0;i<items.length;i++){ 
      listItem(items[i]); 
     }; 

    }; 
}; 

window.onload = sitemapstyler; 
</script>

來源

2012-05-12 redacted

見我fork of your jsFiddle.的基本思路是抓住a元素...

var a = li.getElementsByTagName("a")[0];

，並添加一個事件處理它。

if (!a.hasAttribute("href")) 
    a.onclick = showHide;

對於非鏈接，只需忽略href屬性。

來源

2012-05-12 01:52:08 mgiuffrida

我沒有看到所期望我點擊「第一鏈接」（詞不是箱）其工作，並沒有展開...... – redacted

@redacted我的壞了，忘了點擊「更新」。嘗試新的鏈接。 – mgiuffrida

偉大的工作，但可以請你解釋一下，我可以修改，所以如果類是連接我幾乎不知道它的JavaScript之前不打算頁面擴大。 – redacted

的JavaScript擴展的樹狀輕量級

回答

相關問題