Clique em Div, mas quero que os elementos da criança reagam para clicar

StackOverflow https://stackoverflow.com/questions/554817

  •  23-08-2019
  •  | 
  •  

Pergunta

Meu DOM se parece com o seguinte:

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

Ok, então eu tenho muitos desses elementos na minha página, então, usando o jQuery, vincula todos os eventos como este:

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


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

Agora, quando alguém clica no 1º hiperlink, quero alterar a imagem para "/img1_on.gif", depois faça uma chamada de Ajax para uma página da web e substitua o valor entre o com o valor retornado.

O mesmo acontece quando a outra imagem é clicada, exceto que a imagem muda para "/img2_on.gif" e vai para outro URL.

Seria mais fácil se eu converter o em uma div e adicionar alguns CSs?

Nenhuma solução correta

Outras dicas

$(".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();
});

Você o tinha para que a div fosse clicada, e não os links dentro da div. Essa função deve funcionar para você, supondo que você preencha a parte do Ajax.

Não tenho muita certeza do que você está perguntando, mas se você deseja encontrar o elemento que causou o evento de clique, pode usar o e.Target e, em seguida, $ (e.Target) a partir daí. Algo assim.

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

Por exemplo, selecione apenas sub-links (isto será o link):

$(".profile > a")

Para imagens (isto será a imagem para manipular):

$(".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
});

Você encontrará isso publicar Explicando exatamente qual é a ordem do evento e o que significa ouvir um evento durante a fase de captura ou borbulha e quando cancelar a propagação de eventos adicionais.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top