Avatar billede AnyFellow Mester
10. juni 2012 - 12:55 Der er 9 kommentarer og
1 løsning

jquery: Fang klik på href med bestemt class i en div

Hej

Jeg fanger i dag alle kliks på links i min div via denne (alle links er dynamisk tilføjet på baggrund af brugerens valg):
$('#shoppingbasketContent').on('click', 'a', function()

Min div ser således ud, efter den er opdateret med jquery:

<div id="shoppingbasketContent">
  <a href="#" class="test1">Test1</a>
  <a href="#" class="test2">Test2</a>
</div>


Jeg har prøvet følgende, uden held:
$('#shoppingbasketContent .test1').on('click', 'a', function()

Jeg har googlet, men synes ikke jeg kan finde lige netop det der kan hjælpe mig videre.
Avatar billede AnyFellow Mester
10. juni 2012 - 13:16 #1
Fandt selv en løsning.

$('#shoppingbasketContent').on('click', 'a', function() {
  if ($('a').hasClass("test1")) {
    // Do something
  } else if ($('a').hasClass("test2")) {
    // Do something else
  }
}
Avatar billede softspot Forsker
10. juni 2012 - 13:20 #2
Prøv evt. med:

$('#shoppingbasketContent .test1').on('click', function() {});

Da du jo allerede har fat i anchor-elementet via den class du har angivet i selector-strengen, er det ikke nødvendigt at angive et element i anden parameter... vil jeg mene :-)
Avatar billede AnyFellow Mester
10. juni 2012 - 13:39 #3
softspot...> Den fanger ikke klikket.
Avatar billede softspot Forsker
10. juni 2012 - 13:41 #4
Og da du skal bruge en delegeret event-handler, skal det nok gøres således:

$('#shoppingbasketContent').on('click', '.test1', function() {});
Avatar billede AnyFellow Mester
10. juni 2012 - 13:47 #5
Super, synes det fungerer bedre i mit setup end det jeg selv fandt.

Hvis du vil have point vil jeg oprette et nyt spørgsmål med point til dig?
Avatar billede softspot Forsker
10. juni 2012 - 13:56 #6
Ikke nødvendigt.

Godt du kan bruge det. Om ikke andet er det mere direkte og dermed nok også lettere at læse og forstå... :-)
Avatar billede AnyFellow Mester
10. juni 2012 - 14:01 #7
Tak for hjælpen :)
Avatar billede olebole Juniormester
10. juni 2012 - 21:01 #8
<ole>

Wrong! Af de viste, er #1 den bedst performende  =)

/mvh
</bole>
Avatar billede olebole Juniormester
10. juni 2012 - 21:17 #9
- og forklaringen er, at når der klikkes, traverserer jQuery i #1 kun A elementerne under elementet med id="shoppingbasketContent". Først findes A elementerne med en direkte DOM-metode. Derefter traverseres de og diskrimineres på deres className.

Når der klikkes i #4, traverseres alle elementer under elementet med id="shoppingbasketContent". Under traverseringen, diskrimineres ligeledes på elementernes className.
Avatar billede AnyFellow Mester
11. juni 2012 - 08:29 #10
olebole...> Det der tiltalte mig ved 2. metode, var at jeg kunne holde mine funktioner mere adskilte.

Hvordan kan jeg opbygge det således, at min funktion aktiveres når jeg rammer et link med klassen "test1" i min div "shoppingbasket", uden at jeg nødvendigvis skal samle alle min funktioner i en jquery (som i indlæg #1)?
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester