2012-01-30 56 views
0

我有一個jQuery的功能,可以擴大和摺疊div的內容與+-按鈕。用jquery刪除文本內容

Here is an example on my website

在我的管理面板中,我在視頻嵌入代碼之前編寫鏈接列表,並且php使用該鏈接列表創建零件系統。 我的問題是我如何更改jQuery的鏈接列表。 例如我的鏈接列表是:($文本)

http://link1 
http://link2 
http://link3 
http://link4 
http://link5 
*http://link6 
http://link7 

包含*鏈接是活動的一部分。現在6.Bölüm(第6部分)處於活動狀態。 我只想刪除鏈接4之前的鏈接。我說4是因爲我想把*放在中間。 這很難,但我不知道我能做什麼;你能給我一些建議嗎?

而且這裏是我的jQuery代碼。

<script>  
$(function() { 
    var cachedjQuery = $("#partsakla"); 
    var cachedEl = document.getElementById("partsakla"); 
    var cachedStyle = cachedEl.style; 
    if ($("#partsaklasag").text().length > 1) { 
     cachedStyle.visibility = "visible"; 
    } 
    else{ 
     $("#partsakla").hide(); 
    } 
    $("#collapse").click(function() { 
     var elHeight = $("#partsakla").height(); 
     $("#partsakla").animate({ height: "22px" }); 
    });     
    var elHeight = $("#partsakla").height(); 
    $("#expand").click(function() { 
     $("#partsakla").animate({ height: (elHeight) }); 
    }); 
    document.getElementById('collapse').click();     
}); 
</script> 

我想刪除的鏈接list($text)當DIV處於摺疊狀態:如果你願意,你可以使用它。當有人點擊擴展按鈕時,它會變爲正常。可能嗎?

+0

爲什麼這樣... var cachedEl = document.getElementById(「partsakla」);當你可以做到這一點... var cachedEl = $(「#partsakla」); – calumbrodie 2012-01-30 12:41:50

+0

我試過,但它沒有奏效。 – 2012-01-30 12:57:19

+0

@GürselGünacar你的意圖不是很清楚......嘗試解釋我......如果我沒有錯,你想要的是,如果你點擊鏈接10,例如,在頂部欄上,在+和 - 附近:**鏈接8 - 鏈接9 - 鏈接10 - 鏈接11 - 鏈接12 **。那就對了? – davioooh 2012-01-30 16:11:45

回答

0

它看起來像你的展開/收縮容器(部件)工作正常。您只需要一種方法來選擇哪些鏈接保持可見狀態。所以像這樣:

function get_active_link() { 
    return $('#partsaklasag ul li.active'); 
} 

// numberToShow should be an odd number 
// removes the links we want to keep from the list so they stay visible 
function get_links_around($list, $link, numberToShow) { 
    var before, after, start, end, 
     total = numberToShow, 
     $before = $link.prevAll(), 
     $after = $link.nextAll(), 
     curr = $before.length, 
     half = (numberToShow-1)/2; 

    if(before < half) { 
     after = numberToShow-1-before; 
    } 
    else if(after < half) { 
     before = numberToShow-1-after; 
    } 
    else { 
     before = half; 
     after = half; 
    } 

    start = curr-before; 
    end = curr+after; 

    return $list.filter(function(i, v) { 
     return i >= start && i <= end; 
    }); 

} 

function collapse() { 
    var $list = $('#partsaklasag ul li').hide(); 
    get_links_around($list, get_active_link(), 5).show(); 
    $("#partsakla").animate({ height: "22px" }); 
} 

function expand() { 
    var $list = $('#partsaklasag ul li').show(); 
    $("#partsakla").animate({ height: (elHeight) }); 
} 
+0

Thx爲您的答案加藤,但我無法做到這一點。我的名單是$文本我改變$列表爲$ text.And我想顯示5個部分。我不明白我有什麼與numberToShow做。我是新的jquery.Can你解釋更多pls – 2012-01-30 23:44:48

+0

numberToShow,並調用get_links_around,在上面的collapse()函數。您只需調用collapse並在click()函數中展開即可。但說實話,這是一個問答論壇,而不是一個教程網站;你需要開始一些教程和[關於jQuery的書](http://www.amazon.com/gp/product/1935182323/ref=as_li_ss_tl?ie=UTF8&tag=wulf-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=1935182323 )... – Kato 2012-01-31 18:21:14

+0

我並不是說那是卑鄙的,或者讓它聽起來像我在你之上 - 我們都在開始時首先潛入腦中 - 而不是出於誠實;這就像jQuery代碼一樣簡單,這意味着你需要從[一個很好的可靠的概述](http://docs.jquery.com/Tutorials)開始,然後回到這個項目:) – Kato 2012-01-31 18:21:27