Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.07.2016, 14:40
Интересующийся
Отправить личное сообщение для Janom Посмотреть профиль Найти все сообщения от Janom
 
Регистрация: 23.01.2013
Сообщений: 27

Всплытие событий и this, странное поведение
Всем привет!
Объясните дураку, почему так происходит:
Создаю объект с шаблонной функцией, в теле функции используется ключевое слово this, через него пытаюсь получить имя тэга на котором произошло событие, эту функцию назначаю как событие клик двум кнопкам и все работает чудесно, но если вдобавок назначить эту же функцию как клик по BODY, то происходит следующее:
  • кликаю по кнопке (любой из двух) первый раз, срабатывает как надо (событие кнопки, затем событие body)
  • кликаю второй раз (опять же не важно по какой, той же или по соседу), и срабатывает только событие BODY игнорируя событие кнопки
  • дальше куда не кликай срабатывает только событие BODY, событие кнопки кликом мыши вызвать не удается, можно вызвать только через dispatchEvent

Предполагаю, что что-то не то с this, но не пойму, что именно...
Исходник прилагается. Заранее Спасибо!

<html>
	<head></head>
	<body>
		<button id="xxxz">0001</button>
		<button id="xxxx">0002</button>
		<script>
			var q = {
				xxx:function (){
					this.innerHTML += this.tagName;
				}
			}

			
			var x = document.getElementById('xxxz');
			x.addEventListener('click',q.xxx);

			var z = document.getElementById('xxxx');
			z.addEventListener('click',q.xxx);
			
			document.body.addEventListener('click',q.xxx);
		</script>
	</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 14.07.2016, 15:17
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

body.innerHTML изменяет содержимое body
все обработчики событий внутренних элементов затираются

insertAdjacentHTML() разбирает указанный текст как HTML или XML и вставляет полученные узлы (nodes) в DOM дерево в указанную позицию.
Данная функция не переписывает имеющиеся элементы, что предовращает дополнительную серелизацию и поэтому работает быстрее, чем манипуляции с innerHTML.

Синтаксис

element.insertAdjacentHTML(position, text);


position указывает положение element, и может принимать одно из следующих значений:

'beforebegin'
Перед element .
'afterbegin'
Внутри element, перед первым дочерним элементом (потомком).
'beforeend'
Внутри element, после последнего дочернего элемента.
'afterend'
После element.

text строка, которая будет проанализирована как HTML или XML и вставлена в DOM дерево документа.

Последний раз редактировалось Vlasenko Fedor, 14.07.2016 в 15:28.
Ответить с цитированием
  #3 (permalink)  
Старый 15.07.2016, 21:47
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Сообщение от Poznakomlus
серелизацию
Аутентично, чо. )))

ТС, к этой xxx прикрути функцию инициализации ивентов после замены хтмля и усе будет чики-пуки.
Ответить с цитированием
  #4 (permalink)  
Старый 15.07.2016, 22:23
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

warren buffet,
читай внимательно и в предыдущих темах так-же, никто головой об доску бить не будет. еще раз подумай что написал, не понимаешь, прочитай 2-3 раза, забей и отдохни
Ответить с цитированием
  #5 (permalink)  
Старый 17.07.2016, 05:00
Интересующийся
Отправить личное сообщение для Janom Посмотреть профиль Найти все сообщения от Janom
 
Регистрация: 23.01.2013
Сообщений: 27

Сообщение от warren buffet Посмотреть сообщение
ТС, к этой xxx прикрути функцию инициализации ивентов после замены хтмля и усе будет чики-пуки.
Спасибо конечно, но это не тема топика) И так ясно что переопределив сработку событий все будет "чики-пуки", но прошу перед тем как ответить, вникнуть в вопрос, где тема вопроса была ПОЧЕМУ, а не КАК) Господин Познакомлюсь все правильно написал, вник в вопрос и ответил, ответил надо заметить больше чем я спрашивал, так еще и по делу) А Ваш ответ, не хочу обидеть, выглядел так:
-вопрос: Как почистить унитаз если ершик сломался?
-ответ: Мой раздроченым, только активнее и все будет "чики-пуки".
Какой-то не точный ответ для людей связанных с точными науками) Спасибо за совет, но я пожалуй буду рациональнее расходовать ресурсы)
Ответить с цитированием
  #6 (permalink)  
Старый 19.07.2016, 16:09
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Это про "серелизацию" он правильно написал? ))) Типа покакал - провел серилизацию. Угораю с вас.

Сериализация - вот как пишется селяне.

Пойду бухану с горя... )))
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Странное поведение readonly ArtemKrass Элементы интерфейса 17 20.03.2014 11:12
Странное поведение jQuery borodatych Javascript под браузер 5 27.02.2014 11:47
Всплытие событий или что то не так... Кирюха =) jQuery 6 30.03.2013 12:56
Странное поведение переменной mycoding Серверные языки и технологии 4 14.01.2011 19:18
Странное поведение replace cooli0 Общие вопросы Javascript 4 25.01.2010 17:16