2013-04-28 80 views
0

我想在我的網站上顯示麪包屑.. 我在我的網站中使用jquery bbq。Codeigniter,jquery,想要顯示麪包屑

我試圖在我的網站中實施麪包屑。

我的麪包屑查看文件包括:

<ul class="breadcrumb"> 

</ul> 

在燒烤我想這樣的劇本,

var url = $.param.fragment(); 
      var breadcrumb=$('.breadcrumb'); 
      var BreadCrumbBar ='<li><a href="#">PBS</a><span class="divider">></span></li>'; 
      var BreadCrumbsSplit = url.split('/'); 
      breadcrumb.empty(); 
      breadcrumb=BreadCrumbBar; 

      $.each(BreadCrumbsSplit,function(breadurl){ 
       breadcrumb.append('<li><a href="#'+BreadCrumbsSplit[breadurl]+'"></a></li>\n'); 
      }); 

這裏就是我試圖做的,但不能完全弄清楚,如何執行它?

首先我得到的錯誤在Firebug是.append不是一個函數,

其次,在.each()循環,我想加入這一行太<span class="divider">/</span><li><a href="#'+BreadCrumbsSplit[breadurl]+'"></a></li>

它的作用,這將增加/之間的麪包屑,但我不希望這/在最後<li></li>標籤..

任何人都可以在這方面幫助我,如何實現它?

只需在最後的結果我想代碼產生這樣的

<li><a href="#">PBS</a> <span class="divider">/</span></li> 
    <li><a href="#home">Home</a> <span class="divider">/</span></li> 
    <li><a href="#library">Library</a> <span class="divider">/</span></li> 
    <li class="active">Data</li> 
+0

@Mohammad Adil,只是想用'>'爲第一個孩子。 對於我想要的下一個孩子'/' – 2013-04-28 09:52:43

回答

2
var url = $.param.fragment(); 
var breadcrumb=$('.breadcrumb'); 
var BreadCrumbBar ='<li><a href="#">PBS</a><span class="divider">></span></li>'; 
var BreadCrumbsSplit = url.split('/'); 
var total = BreadCrumbsSplit.length; 
breadcrumb.empty(); 
breadcrumb=BreadCrumbBar; 

$.each(BreadCrumbsSplit,function(index){ 
    if(index !== total-1){ 
    breadcrumb.append('<li><a href="#'+BreadCrumbsSplit[index]+'"></a><span class="divider">/</span></li>\n'); 
    }else{ 
    breadcrumb.append('<li><a href="#'+BreadCrumbsSplit[index]+'"></a></li>\n'); 
    } 
}); 

SRY沒有測試過一些事情,但它應該工作.. :) 加總的元素數,如果最後一個元素不要插入分隔線,如果有錯誤,你可以很容易地修復它

+0

在螢火蟲控制檯上出錯,'BreadCrumbsSplit.length'不是函數? – 2013-04-28 10:25:03

+0

這是錯誤的......長度! :)我糾正了它:) – 2013-04-28 10:26:35

+0

'BreadCrumbsSplit.lenght' – 2013-04-28 10:38:27