Javascript.RU

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

почему не кликабельные производные от append
Здравствуйте посмотрите пожалуйста этот код
такое впечатление что объекты с классом child_cnt2 не появились,
при клике на них (красный цвет) их класс не отображается
почему?
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js "></script>
</head>
<body>
<style>
.parent_cnt{
width:100px;
height:200px;
background:#eee;
}
.child_cnt{
width:100px;
height:50px;
background:#ee9;
border:1px solid #333;
cursor:pointer;
}
.child_cnt2{
width:100px;
height:50px;
background:red;
border:1px solid #333;
cursor:pointer;
}
</style>
<div class="parent_cnt">
<div class="child_cnt"></div>
<div class="child_cnt"></div>
</div>
<script>
$('div').click(function(){
alert($(this).attr('class'))
});
</script>
<script>
$('.child_cnt').click(function(){
$('.parent_cnt').empty();
$('.parent_cnt').append('<div class="child_cnt2"></div><div class="child_cnt2"></div>')

});
</script>
</body>
</html>

Последний раз редактировалось imedia, 11.08.2014 в 14:39.
Ответить с цитированием
  #2 (permalink)  
Старый 11.08.2014, 14:41
Аватар для MallSerg
Профессор
Отправить личное сообщение для MallSerg Посмотреть профиль Найти все сообщения от MallSerg
 
Регистрация: 07.03.2011
Сообщений: 1,127

Uncaught ReferenceError: $ is not defined
т.е. для начала не подключен jQuery
Ответить с цитированием
  #3 (permalink)  
Старый 11.08.2014, 14:46
Профессор
Отправить личное сообщение для WorM32 Посмотреть профиль Найти все сообщения от WorM32
 
Регистрация: 11.02.2014
Сообщений: 303

Потому что элементы добавлены после того, как был повешен обработчик.

нужно делать так:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js "></script>
</head>
<body>
<style>
.parent_cnt{
width:100px;
height:200px;
background:#eee;
}
.child_cnt{
width:100px;
height:50px;
background:#ee9;
border:1px solid #333;
cursor:pointer;
}
.child_cnt2{
width:100px;
height:50px;
background:red;
border:1px solid #333;
cursor:pointer;
}
</style>
<div class="parent_cnt">
<div class="child_cnt"></div>
<div class="child_cnt"></div>
</div>
<script>
$(document).on('click', 'div', function(){
alert($(this).attr('class'));
});
</script>
<script>
$('.child_cnt').click(function(){
$('.parent_cnt').empty();
$('.parent_cnt').append('<div class="child_cnt2"></div><div class="child_cnt2"></div>')

});
</script>
</body>
</html>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вызов конструктора без new. Почему не со всеми работает? danik.js Javascript под браузер 2 23.02.2014 00:09
Почему можно использовать id элемента без использования getElementById? grifangel Общие вопросы Javascript 3 08.01.2014 22:20
Почему некоторые операторы возвращают значения, а не ссылки? dump Общие вопросы Javascript 15 25.07.2012 17:28
Свойства объекта, методы и this. Почему свойство вызывается с () ? jsuse Общие вопросы Javascript 2 04.11.2011 20:39
Различия между append и appendTo voooodoo jQuery 2 04.03.2011 22:45