Javascript.RU

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

События динамично созданных кнопок
Добрый день, друзья!
Столкнулся с проблемой: события для динамично созданных объектов не работают
//info = [id, start, finish, time, distance, price];
//динамически создаю объекты
function echo(info) {
	var i = 0;
	var Form = document.getElementById('fms');
	var Div = document.createElement('div');
	Div.id = 'main';
	Form.appendChild(Div);
	var id = info[info.length-1];
	while (info.length > 0 ){
		i++;
		var field = info.pop(); 
		var Inner = document.createElement('input');
		Inner.id = 'elem'+id+i;
		Inner.name = 'elem'+id;
		Inner.size = field.length;
		Inner.value = field;
		Div.appendChild(Inner);
	}
	var DeleteLink = document.createElement('input');
	DeleteLink.type = 'button';
	DeleteLink.value = 'Готово';
	DeleteLink.id = 'DelBut';
	DeleteLink.name = id;
	Div.appendChild(DeleteLink);
}

События нужны по нажатию на кнопке с id='DelBut' при этом нужно получать значение из текущей нажатой кнопки, например name
//не работает
var elt = document.getElementById("DelBut"); 
    elt.onclick = function() { console.log(this.name); }
//не работает
	$("#DelBut").click(function () {
		console.log('jr');
		console.log($(this).text());
    });
Ответить с цитированием
  #2 (permalink)  
Старый 16.09.2014, 11:33
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от devastor
события для динамично созданных объектов не работают
На момент "навешивания" событий тех элементов просто нет.
Решение:
- навешивать события при создании
- использовать делегирование событий
Ответить с цитированием
  #3 (permalink)  
Старый 16.09.2014, 11:49
Интересующийся
Отправить личное сообщение для devastor Посмотреть профиль Найти все сообщения от devastor
 
Регистрация: 09.09.2014
Сообщений: 27

Сообщение от ksa Посмотреть сообщение
На момент "навешивания" событий тех элементов просто нет.
Решение:
- навешивать события при создании
- использовать делегирование событий
Можно ссылку на какой-нибудь мануал или пример, что бы разобраться?
Спасибо
Ответить с цитированием
  #4 (permalink)  
Старый 16.09.2014, 12:59
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

Используй метод .on() вместо .click(). (делегирование)
Либо создай какую нибудь универсальную функцию, которая навешивает твой обработчик на вновь создаваемые элементы
Ответить с цитированием
  #5 (permalink)  
Старый 16.09.2014, 14:36
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от devastor
Можно ссылку на какой-нибудь мануал или пример, что бы разобраться?
http://javascript.ru/tutorial/events...-obrabotchikov
http://api.jquery.com/on/
Ответить с цитированием
  #6 (permalink)  
Старый 16.09.2014, 16:51
Интересующийся
Отправить личное сообщение для devastor Посмотреть профиль Найти все сообщения от devastor
 
Регистрация: 09.09.2014
Сообщений: 27

Спасибо, получилось повесить событие при создании элемента
DeleteLink.onclick = function (){//выполняемые действия};

Отличный форум, очень помогаете, ребята!
Ответить с цитированием
  #7 (permalink)  
Старый 16.09.2014, 23:40
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

быстрее клонировать элементы и лучше использовать fragment
а обработчик можно навесить на существующий родитель
небольшой пример http://jsfiddle.net/vlasenkofedor/hyQnb/
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Обработка события внутри события grifangel Общие вопросы Javascript 6 04.09.2014 12:34
Дебаг js, или как найти обработчик события для тега jimm88 Events/DOM/Window 1 18.04.2012 15:11
Как сделать чтобы клавиатурные события пропускались сквозь флешку? khusamov Общие вопросы Javascript 3 11.02.2012 16:48
Передача параметров в колбэки и дальнейшее их вешанье на события. Gremlin Общие вопросы Javascript 17 13.08.2011 08:54
Dom и события кнопок Гость Events/DOM/Window 4 07.08.2008 18:53