Clicca su div, ma vogliono elementi figli di reagire a cliccare

Question

Il mio dom simile a questa:

<div class="profile">
       <a href="#"><img src="/img1.gif" /></a> <b>100</b>
       <a href="#"><img src="/img2.gif" /></a>
</div>

Ok, quindi ho molti di questi elementi sulla mia pagina, in modo da utilizzare jQuery ho legare tutti gli eventi di questo tipo:

$(".profile").live('click', myCallback);


var myCallback = function(event) {
         // ??
};

Ora, quando un utente fa clic sul primo collegamento ipertestuale, voglio cambiare l'immagine da "/img1_on.gif", poi fare una chiamata AJAX a una pagina web e di sostituire il valore tra i tag con il valore restituito.

La stessa cosa happends quando l'altro si fa clic sull'immagine, tranne l'immagine cambia a "/img2_on.gif" e va a un altro URL.

sarebbe più facile se mi sono convertito il in un div e aggiungere un po css?

Answer 1

$(".profile a").live("click", function(e) {
  var temp = $("img", this);
  var temp2 = temp.attr("src").split('.');

  temp.attr("src", temp2[0] + "_on" + temp2[1]);

  // Ajax goes here.

  e.preventDefault();
});

Hai avuto modo che il div è stato quello di essere cliccato, e non i link all'interno del div. Questa funzione dovrebbe funzionare per voi, a patto di riempire la parte Ajax.

Answer 2

Non sono del tutto sicuro di quello che stai chiedendo, ma se si vuole trovare l'elemento che ha causato l'evento click, è possibile utilizzare e.target, e quindi $ (e.target) da lì. Qualcosa come questo.

$(".profile").live('click', function(e){
  if($(e.target).is("a"))
     $(e.target).find("img").attr("src","/new/url.jpg");
});

Answer 3

Ad esempio, selezionare sub-link solo ( questo sarà il link):

$(".profile > a")

Per le immagini ( questo sarà l'immagine di manipolare):

$(".profile > a > img").live("click", function(event) {
    var src = $(this).attr("src");
    $(this).attr("src", src.replace(".gif", "_on.gif"));
    // ajax call in any way you prefer
    // in callback you can switch button state back
});

Answer 4

Troverete questo postale esattamente che spiega che cosa l'ordine evento è e che cosa cosa significa per ascoltare un evento durante la fase di cattura o immissione e quando per annullare ulteriormente propagazione degli eventi.