Как при клике на элементе получить его id?

Question

[German7]

Прошу помощи. Как при срабатывании обработчика событий .addEventListener, а конкретно при левом клике мыши на элементе, занести значение id в отдельную переменную? Искал подобное, но к сожалению не нашёл.
Заранее благодарю!

Answer 1

[Владимир Проскурин]

эмм. Вы уже сделали больше половины дела. В обработчике this.id

Comments

[German7]

Извините, так? Просто я новичок, попробовал как понял но не получилось... После завершения события myId = undefined.

Code

var removeInput = document.getElementById('row').getElementsByTagName('a');
removeInput.addEventListener('click', function(){
    var myId = this.id;
});

[Владимир Проскурин]

Разберитесь с областью видимости переменных.

var removeInput = document.getElementById('row').getElementsByTagName('a');
removeInput.addEventListener('click', function(){
    var myId = this.id; // Так переменная создается в локальной области видимости. Ее нигде не видно, только внутри события
});
// Тут myId не видно.

Чтобы было видно, нужно делать так.

var removeInput = document.getElementById('row').getElementsByTagName('a');
var myId;
removeInput.addEventListener('click', function(){
    myId = this.id; // Так переменная создается в глобальной области видимости. 
});
alert(myId); // все в порядке

Помимо этого, метод getElementsByTagName возвращает список элементов, а не один элемент. А вы хотите вешать обработку addEventListener на элемент, а вешаете на список. Поэтому событие вообще не работает.
Правильнее будет вот так

var removeInputsList = document.getElementById('row').getElementsByTagName('a');
for(var ind in removeInputsList) {
	var input = removeInputsList[ind];
  input.addEventListener('click', function(){
    var myId = this.id; // Если с переменной работаете только тут, то можно (нужно) не делать ее глобальной
    alert(myId); // Выводим, все гуд
	});
}

jsfiddle.net/9etrmcyx

[German7]

Владимир Проскурин, Большое спасибо за развернутый ответ, сейчас же начну изучение!

Answer 2

[GennadyPHP]

$(elem).attr("id") // - получаешь значение атрибута

// пример
$("button").click(function(){
    $(this).attr(id); // пример с получением ID кнопки, на которую нажали
})

Comments

[German7]

Спасибо, но к сожалению нужно без jQuery :)