2013-04-08 19 views
7

Ho alcuni collegamenti dinamicamente popolati in un elenco sul mio sito che si collega ai file. È possibile utilizzare jQuery per vedere se il nome del file termina con .pdf e aggiungere una classe a href o simile se il testo del link termina con .mp3?jQuery aggiungi classe a href se il collegamento contiene un testo specifico

Per esempio io ho i seguenti link nella mia lista:

  • Document1.pdf
  • song1.mp3
  • Song2.m4a
  • Document2.doc

lo farei piace rilevare le lettere finali e aggiungere classi diverse ai collegamenti, quindi al link che ha il testo Document1.pdf aggiungerei la classe pdf all'elemento di ancoraggio e il collegamento con il testo Song1.mp3 aggiungerei la classe mp3 all'elemento di ancoraggio.

risposta

35

Utilizzare il selettore di attributo:

$('a[href$=".mp3"]')... 

Opzioni:

 
    Attribute Contains Prefix Selector [name|="value"] 
    Selects elements that have the specified attribute with a value 
    either equal to a given string or starting with that string followed 
    by a hyphen (-). 

    Attribute Contains Selector [name*="value"] 
    Selects elements that have the specified attribute with a 
    value containing the a given substring. 

    Attribute Contains Word Selector [name~="value"] 
    Selects elements that have the specified attribute with a value 
    containing a given word, delimited by spaces. 

    Attribute Ends With Selector [name$="value"] 
    Selects elements that have the specified attribute with a 
    value ending exactly with a given string. The comparison is case sensitive. 

    Attribute Equals Selector [name="value"] 
    Selects elements that have the specified attribute with a 
    value exactly equal to a certain value. 

    Attribute Not Equal Selector [name!="value"] 
    Select elements that either don’t have the specified attribute, 
    or do have the specified attribute but not with a certain value. 

    Attribute Starts With Selector [name^="value"] 
    Selects elements that have the specified attribute with a 
    value beginning exactly with a given string. 

    Has Attribute Selector [name] 
    Selects elements that have the specified attribute, with any value. 

    Multiple Attribute Selector [name="value"][name2="value2"] 
    Matches elements that match all of the specified attribute filters. 

Check out the API per ulteriori informazioni.

-1
$('a[href$=".mp3"]').addClass("mp3"); 
$('a[href$=".pdf"]').addClass("pdf"); 
+0

Ehm, forse il secondo dovrebbe dire – Eoin

+0

'$ ('a [href $ = ". pdf"] '). addClass ("pdf"); ' – Eoin

+0

Modificato, grazie. – Aioros

1

dato tutto tali collegamenti hanno classe .file

var exts = ['pdf','xls']; 
$('a.file').each(function(){ 
    if($(this).attr('href').match(new RegExp('('+exts.join('|')+')'), 'gi')) 
     $(this).addClass($(this).attr('href').match(/\w{3}$/gi)[0]); 
}) 

Questo codice aggiungerà l'estensione classe di tutti tali link che hanno estensione di file in exts array.

0

Invece di difficile codifica tutti i tipi, si può anche fare una soluzione che verrà automaticamente fare questo per tutti i link:

var regex = "/\..{3,4}$/"; 
$('a').each(function() { 
    $(this).addClass(regex.match($(this).attr("href"))[0] 
}); 
Problemi correlati