'5'ten fazla bağlantı eklendiğinde metin ekleyin ve görüntülensin: none; 5 'den fazla komut varsa?

Question

Ben şöyle my kodları var:

.keywords a { 
font-style:italic;} 

.keywords a:nth-of-type(n+5) { 
display:none} 

<div class="keywords">{Keywords}</div> 

anahtar kelimeler-bağlantılar ve otomatik olarak eklenecektir.

(eğer [Bunların hepsi farklı olarak görülebilir, örneğin sadece ilk beş gösterilir olsa, bu kendisi

olsa bu kodda olmaz istiyorum olduğunca fazla anahtar kelime eklemek mümkündür sayfadaki makaleler, her biri bu = 'anahtar kelimeler']

k1 div vardır

k1, k2, k3

k1, k2, k3, K4, K5

_ 5'ten fazla anahtar kelime varsa

:

k1, k2, k3, K4, K5 [, k6, k7] - Bu iki

i için onu nasıl görünmez olmak (ayrıca 7 anahtar kelimeler):

k1, k2, k3, K4, K5 [, k6, k7] daha fazlası - k6 ve k7 tekrar gizlidir, ancak 'daha' bağlantısı eklenir) şimdi

Ben '5'ten fazla anahtar kelime varsa,' daha 'gibi bir' daha fazla 'bağlantı eklemek ve daha sonra' daha 'ekleyebilirsiniz, ancak bunu nasıl yapacağımı bilmiyorum. Gerekli bir senaryo var mı?

Answer 1

Bunun gibi bir şey mi var? https://jsfiddle.net/cd4aa8a0/1/

Yani ben js biraz dahil ve ben bir komut dosyası "daha" davayı bağlantılar için gerekli olduğunu düşünüyorum sizin css

.keywords:nth-child(n+6) a { 
    display: none; 
} 

JS

$(".show").on('click', function(){ 
     $(".keywords:nth-child(n+6) a").toggle(); 
    });