Нажмите на DIV, но хотите дочерние элементы реагировать на кнопку

Question

Мой дом выглядит следующим образом:

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

Ok поэтому у меня есть многие из этих элементов на моей странице, поэтому с помощью JQuery я связать все события, как это :

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


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

Теперь, когда кто-то нажимает на 1 гиперссылкой, я хочу, чтобы изменить изображение на «/img1_on.gif», а затем сделать вызов Ajax на веб-страницу и заменить значение между с возвращаемое значение.

То же самое происходит при нажатии на другое изображение, за исключением того, что изображение изменяется на «/img2_on.gif», и оно переходит к другому URL-адресу.

Было бы проще, если бы я преобразовал в div и добавить некоторые 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(); 
}); 

Вы должны были это так, чтобы DIV был один из них нажал, а не ссылки внутри от дел. Эта функция должна работать для вас, предполагая, что вы заполните часть ajax.

Answer 2

Я не совсем уверен, что вы просите, но если вы хотите найти элемент, вызвавший событие click, вы можете использовать e.target, а затем $ (e.target) оттуда. Что-то вроде этого.

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

Answer 3

Например, выберите только вложенные ссылки (это будет по ссылке):

$(".profile > a") 

Для изображений (это будет изображение, чтобы манипулировать):

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

Вы найдете это post, точно объясняющее, что такое заказ событий и что значит слушать t o событие во время фазы захвата или барботажа, а также для отмены дальнейшего распространения события.