2013-08-20 59 views
1

這就是一個延續: How do I recursively assign each item in a list an unique ID?多層次遞歸的ID添加到列表

我想出答案的一部分,當我想在<li>級別這裏 http://jsfiddle.net/UvQmC/14/

但我加以應用注意我這裏有一個問題:

http://jsfiddle.net/eloiterman/jCup4/5/

HTML:

<html><head></head> 
    <body> 
    <div class="wayfinder"></div> 
    <!-- dynamically add links to --> 
    <div class="fsscroller"> 
    <ul> 
     <li><span class="name">Start state</span> 

      <ul class="show"> 
       <li><span class="name">Superstate 1</span> 

        <ul class="show"> 
         <li><span class="name">Start Cycle</span> 

          <ul class="show"> 
           <li><span class="name">task 1 </span> 

           </li> 
           <li><span class="name">task 2 </span> 

           </li> 
           <li><span class="name">task 3 </span> 

           </li> 
          </ul> 
         </li> 
        </ul> 
       </li> 
      </ul> 
     </li> 
     <li><span class="name">X-fer to dal</span></li> 
     <li><span class="name">another task</span></li> 
     <li><span class="name">Yet another task</span></li> 
     <li><span class="name">Yet even another task</span></li> 
     <li><span class="name">enough already!</span></li> 


     <li><span class="name">end cycle</span> 

     </li> 
    </ul> 
    </div> 
    </body></html> 

腳本:

 $("div > ul > li").each(function(idx){ 
      $(this).attr("id","sitemap-item-"+ ++idx); 
      $(this).find("> ul > li").each(function(idx2){ 
       $(this).attr("id","sitemap-item-"+ idx + "-" + ++idx2);    
      });    
     }); 

的錯誤是,它並沒有搜索所有DOM中嵌套列表項。在我的例子中。 麻煩的是,我可以根據它們的加載方式,以任意順序包含任意數量的嵌套的ul和列表項。

+1

你的代碼是缺少了許多結束標記,先清潔並再次嘗試:) – TecHunter

+0

@TecHunter好,謝謝指出了這一點 - 我忘了一些閉幕標籤,但它是固定的 - 問題是,它仍然忽略了列表標籤的級別,並沒有分配標識號給他們 – namretiolnave

+0

你應該只包含相關的代碼。點擊處理程序中的所有代碼似乎都不相關。除此之外,你提到了遞歸,但實際上並沒有任何代碼。這是你的問題。 –

回答

1

你實際上並沒有任何遞歸,所以你」只是簡單地循環遍歷2個級別。你可以做這樣的事情:

function addIDs($els, base){ 
    $els.each(function(i){ 
     var $this = $(this); 
     var id = base + "-" + i; 

     $this.attr("id", id); 
     addIDs($this.find("> ul > li"), id); 
    }); 
} 

addIDs($("div > ul > li"), "sitemap-item"); 

http://jsfiddle.net/jCup4/10/

+0

感謝這個演示 - 我假設這是使用遞歸 - 而不是命名他們全部順序,他們可以根據他們在哪裏dom命名 – namretiolnave

+1

正確,這將基於他們的嵌套命名而不是順序。 –

1

爲什麼不繼續選擇平的,像下面和idx變量會自動增加,因爲每一種方法找到下一個列表元素:

$("li").each(function(idx){ 
    $(this).attr("id","sitemap-item-" + idx);   
}); 
+0

- 因爲想象它更復雜使它看起來正確:)。 – namretiolnave