Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.08.2015, 23:52
Интересующийся
Отправить личное сообщение для serhioses Посмотреть профиль Найти все сообщения от serhioses
 
Регистрация: 17.02.2015
Сообщений: 12

Обработчик событий
Каким образом можно на нативном JS сделать выборку элементов (например document.getElementsByTagName('a')) и повесить каждому элементу отобранного массива обработчик? В JQuery понятно, можно сразу вешать допустим click (например $('a').click(function () { $(this)... };) и внутри к текущему элементу обращаться как $(this). Как это сделать на нативном JS? ведь document.getElementsByTagName('a').addEventListene r('click', function () {}, false); не работает.
Ответить с цитированием
  #2 (permalink)  
Старый 04.08.2015, 00:12
Аватар для EmperioAf
Профессор
Отправить личное сообщение для EmperioAf Посмотреть профиль Найти все сообщения от EmperioAf
 
Регистрация: 15.01.2015
Сообщений: 622

да, а

document.getElementsByTagName('a')[0].addEventListener('click', function () {}, false); сработает
Ответить с цитированием
  #3 (permalink)  
Старый 04.08.2015, 06:33
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

serhioses,
циклом по всем элементам способом EmperioAf,
Ответить с цитированием
  #4 (permalink)  
Старый 04.08.2015, 09:34
Интересующийся
Отправить личное сообщение для serhioses Посмотреть профиль Найти все сообщения от serhioses
 
Регистрация: 17.02.2015
Сообщений: 12

Не понимаю... допустим есть список:
<ul>
<li><a data-id="1"></a></li>
<li><a data-id="2"></a></li>
<li><a data-id="3"></a></li>
<li><a data-id="4"></a></li>
</ul>

Как мне навесить click на каждую ссылку?
JQuery: $('a').click(function () { var id = $(this).data('id') });
Как это сделать на JS?
Ответить с цитированием
  #5 (permalink)  
Старый 04.08.2015, 10:46
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от рони
Как это сделать на JS?
Сообщение от рони
циклом по всем элементам способом EmperioAf
в JQuery точно такой же цикл но скрытый внутри.
Ответить с цитированием
  #6 (permalink)  
Старый 04.08.2015, 10:58
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

serhioses,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  a:after{
    content: attr(data-id);
  }

  </style>
</head>

<body>
   <ul>
<li><a data-id="1"></a></li>
<li><a data-id="2"></a></li>
<li><a data-id="3"></a></li>
<li><a data-id="4"></a></li>
</ul>
<script>
    var a = document.getElementsByTagName('a'), fn = function() {
   alert(this.dataset.id)
},i=0, el;
for ( ; el = a[i++]; )  el.addEventListener('click', fn, false);
</script>
</body>

</html>
Ответить с цитированием
  #7 (permalink)  
Старый 04.08.2015, 20:21
Интересующийся
Отправить личное сообщение для serhioses Посмотреть профиль Найти все сообщения от serhioses
 
Регистрация: 17.02.2015
Сообщений: 12

Спасибо большое!!!!!!!!! Я так тупил... У меня был следующий код для теста:
for (var i = 0; i < a.length; i++) {
	a[i].addEventListener('click', (function (i){
		console.log(i);
	}(i)), false);
}


Естественно он сразу же и срабатывал.
И я сидел думал ну как еще можно повесить событие на элемент. А потом с помощью вашего решения понял что мне просто внутри нужно вернуть функцию и все будет работать!
for (var i = 0; i < a.length; i++) {
		a[i].addEventListener('click', (function (i){
			return function () {
				console.log(i);
			}
		}(i)), false);
	}

Спасибо!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
обработчик событий для динамически добавленных элементов Tecvid Events/DOM/Window 28 25.06.2018 13:49
Прикрутить обработчик событий Jok3r Общие вопросы Javascript 5 05.08.2014 17:44
Размножается обработчик событий demoniqus Общие вопросы Javascript 3 22.10.2012 14:04
не удается убрать обработчик событий. mitiya Общие вопросы Javascript 0 08.09.2012 21:18
Обработчик событий kucaeva Общие вопросы Javascript 2 10.12.2010 16:42