Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.07.2011, 13:47
Интересующийся
Отправить личное сообщение для artnik Посмотреть профиль Найти все сообщения от artnik
 
Регистрация: 19.01.2011
Сообщений: 28

jQuery: -- Не работают скрипты в блоках созданных при помощи jQuery clone(), append()
Как можно заставить jQuery запускать события, к примеру при клике, в блоках созданных через append(), after() и т.п.
События почему-то срабатывают только для обычных блоков выведенных PHP скриптом.

К примеру, вот готовый миникод:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<div class="event">Кликни на меня</div>

<script> 
$('.event').click(function() {
    alert('произошел клик')
}); 
$('.event').after(' 
   <div class="event">Кликни на меня2</div>
 '); 
</script>


Если нажать на "Кликни меня2" то ничего не произойдет. Почему так? И как эту траблу решить?

PS: <div onclick="blabla()"> срабатывает если в функции не использовать jQuery

Последний раз редактировалось artnik, 19.07.2011 в 13:51.
Ответить с цитированием
  #2 (permalink)  
Старый 19.07.2011, 14:17
Аватар для kobezzza
Быдлокодер;)
Отправить личное сообщение для kobezzza Посмотреть профиль Найти все сообщения от kobezzza
 
Регистрация: 19.11.2010
Сообщений: 4,338

Господи, да что же вы не пользуетесь поиском, перед тем как задавать вопросы... нужно делегировать события для динамичных DOM элементов, в jquery для этого аж 2 метода: live и delegate
__________________
kobezzza
code monkey
Ответить с цитированием
  #3 (permalink)  
Старый 19.07.2011, 14:23
Профессор
Отправить личное сообщение для ваый Посмотреть профиль Найти все сообщения от ваый
 
Регистрация: 29.06.2011
Сообщений: 445

да, раз 5 уже за последние дни!.. резюме сказанного выше:
<div class="event">Кликни на меня</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('.event').live('click', function() {
    alert('произошел клик');
})
.after('<div class="event">Кликни на меня2</div>');
</script>
Ответить с цитированием
  #4 (permalink)  
Старый 19.07.2011, 14:56
Интересующийся
Отправить личное сообщение для artnik Посмотреть профиль Найти все сообщения от artnik
 
Регистрация: 19.01.2011
Сообщений: 28

Работает, спасибо!

kobezzza, поиском я пользоваться умею, но как можно что-то найти если не знаеш как сформулиловать запрос, неужели я бы додумался написать "делегировать события для динамичных DOM элементов", если мне нужно было всего лишь событие при клике подрихтовать
Ответить с цитированием
  #5 (permalink)  
Старый 19.07.2011, 14:59
Интересующийся
Отправить личное сообщение для artnik Посмотреть профиль Найти все сообщения от artnik
 
Регистрация: 19.01.2011
Сообщений: 28

А еще небольшо вопрос из этой-же темы. Если вывести onclick="blabla()" то как можно перехватить текущи блок методом $(this)?

Пример:
<div class="event" onClick="blabla();">Кликани меня</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function blabla() {
	this.style.color = '#c00';
	$(this).hide();
}
</script>


В примере не работает ни один ни другой способ(

Последний раз редактировалось artnik, 19.07.2011 в 15:30.
Ответить с цитированием
  #6 (permalink)  
Старый 19.07.2011, 15:41
Профессор
Отправить личное сообщение для ваый Посмотреть профиль Найти все сообщения от ваый
 
Регистрация: 29.06.2011
Сообщений: 445

<div class="event" onclick="blabla(this);">Кликани меня</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function blabla(obj) {
	obj.style.color = '#c00';
	$(obj).hide();
}
</script>
Ответить с цитированием
  #7 (permalink)  
Старый 19.07.2011, 15:45
Интересующийся
Отправить личное сообщение для artnik Посмотреть профиль Найти все сообщения от artnik
 
Регистрация: 19.01.2011
Сообщений: 28

ваый, ты лучший!!! Спсибенчик тебе, ато эти две бздюшки не давали мне нормально писать скрипты, приходилось чачу воротить
Ответить с цитированием
  #8 (permalink)  
Старый 19.07.2011, 15:51
Профессор
Отправить личное сообщение для ваый Посмотреть профиль Найти все сообщения от ваый
 
Регистрация: 29.06.2011
Сообщений: 445

ну честно говоря, "чача" осталась.. если уж используешь jquery, так давай по-полной. вместо того, что у тебя, смотри что можно:
<div class="event">Кликани меня</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('.event').live('click', function() {
    $(this).css({
        color: '#C00',
        backgroundColor: '#EFC'
    })
    .hide();
});
</script>
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не работают скрипты на jQuery в IE6/7 Александр345 jQuery 6 19.08.2011 13:27
выборка идентификатора при помощи jQuery из цикла PHP... xormax jQuery 4 27.04.2011 13:59