Как определить элемент, по которому был совершен клик?

Question

[Михаил]

Есть куча элементов вида

<a class = "id_1"><a>
<a class = "id_2"><a>
<a class = "id_3"><a>
<a class = "id_3"><a>
<a class = "id_4"><a>
<a class = "id_5"><a>
<a class = "id_6"><a>

Как с помощью jquery узнать, по какому элементу произошел клик?
Ну типа щелкнули по id_6, в консоль вывелось, что типа щелчок по элементу:id_6.

причем это не должно трогать остальные а на сстранице только те у которых класс с ID начинается

Answer 1

[Алексей Зуев]

$(document).on('click', 'a[class^="id"]', function(e) {
    e.preventDefault();
    console.log(e.target);
    console.log(this);
    alert('Вы кликнули по ссылке с классом ' + this.className);
});

В e.target и this - элемент, по которому кликнули.
Делегирование поможет поймать клик на динамически создаваемых элементах

Comments

[Михаил]

Спасибо)))) а я мучился, перменную то в колбек кто будет передавать?))) можете русским языком обьяснить что делает e.preventDefault(); отменяет поведение по умолчанию?

[Алексей Зуев]

Михаил: да, отменяет действие по умолчанию, в случае со ссылкой - отменяет переход

[Алексей Зуев]

Михаил: могу посоветовать статьи про события и про делегирование

[Михаил]

спасибо, почитаю

Answer 2

[Vladimir Nazarov]

$( "a[class^=id_]" ).click(function(e) {
  var $clicked_el = $(e.currentTarget);
  var clicked_class = e.currentTarget.className;
});

api.jquery.com/event.target
api.jquery.com/event.currentTarget

Comments

[Андрей П.]

Спасибо!

Answer 3

[Сергей ZSA]

$("a").bind("click", function(){
alert($(this).attr("class"));
});

Comments

[Михаил]

нуда, только он мне по всем а на странице будет аллерты выкидыввать, а надо только тех у кого класс c c ID начинется

[Сергей ZSA]

а нельзя чтоль сделать вот так в коде:
a.click#id_1
a.click#id_2
a.click#id_3
a.click#id_4
и вытаскивать не классы, а id, ну а с классов клики брать?
То есть JQ будет тогда $(".click").bind("click", function(){ alert($(this).attr("id")); });

[Михаил]

количество A заранее не известно, соотвествено классов с разными номерами тоже, почему так? потому что а создаются динамически в составе блоков с тем же классом

[sim3x]

As of jQuery 1.7, the .on() method is the preferred method for attaching event handlers to a document.

[Михаил]

не работает не $("a").bind "click" не $("a").on"click" на динамически созданных элементов