Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как обратиться к элементу, который был добавлен после полной загрузки DOM? (https://javascript.ru/forum/jquery/24487-kak-obratitsya-k-ehlementu-kotoryjj-byl-dobavlen-posle-polnojj-zagruzki-dom.html)

LysoSutriN 02.01.2012 16:11

Как обратиться к элементу, который был добавлен после полной загрузки DOM?
 
Допустим у меня есть такой файл:
<!DOCTYPE html>
<html>
	<head>
		<script src='http://code.jquery.com/jquery-1.7.1.min.js'></script>
	</head>
	<body>
		<div id='test'>Кликни на меня!</div>
		<div id='block'></div>
		<div id='block2'></div>
		
		<script>
			$(document).ready(function(){
				$('#test').click(function(){
					$('#block').html("<div id='test2'>А теперь на меня!</div>");
				});
				
				$('#test2').click(function(){
					$('#block2').html('Все завершено!');
				});
			});
		</script>
	</body>
</html>


Первый слушатель работает, а второй уже нет. Как же решить эту проблему без функций, типа onclick='javascript:someFunc();'?

devote 02.01.2012 16:26

<!DOCTYPE html>
<html>
    <head>
        <script src='http://code.jquery.com/jquery-1.7.1.min.js'></script>
    </head>
    <body>
        <div id='test'>Кликни на меня!</div>
        <div id='block'></div>
        <div id='block2'></div>
         
        <script>
            $(document).ready(function(){
                $('#test').click(function(){
                    $('#block').html("<div id='test2'>А теперь на меня!</div>").children().click(function(){
                        $('#block2').html('Все завершено!');
                    });
                });
            });
        </script>
    </body>
</html>

LysoSutriN 02.01.2012 16:39

Я упростил код, если я добавляю множество кода после клика. Как обратиться к определенному элементу?

devote 02.01.2012 16:41

$('#block').html("<div id='test2'>А теперь на меня!</div>").find("нужный нам селектор").click

рони 02.01.2012 16:58

devote,
LysoSutriN,

А live ?
<!DOCTYPE html>
<html>
	<head>
		<script src='http://code.jquery.com/jquery-1.7.1.min.js'></script>
	</head>
	<body>
		<div id='test'>Кликни на меня!</div>
		<div id='block'></div>
		<div id='block2'></div>

		<script>
			$(document).ready(function(){
				$('#test').click(function(){
					$('#block').html("<div id='test2'>А теперь на меня!</div>");
				});

				$('#test2').live("click",function(){
					$('#block2').html('Все завершено!');
				});
			});
		</script>
	</body>
</html>

devote 02.01.2012 16:59

рони,
ну я не юзаю джуквери, поэтому не в курсе подобных тонкостей.


Часовой пояс GMT +3, время: 10:08.