Javascript.RU

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

Невозможно обратиться к только что вставленному элементу DOM
Невозможно обратиться к только что вставленному элементу DOM
Приведу примерный код
$(id).click(function(){
$.getJSON(1,function(json){ 
 $(вставляю в начало элемента).prepend(<div id="a1">этот текст</div>);
 });
$("#a1").animate({left: "+=377"}, 1000);
});

Почему при первом клике не работает?
При повторных кликах работает нормально вставленный ранее, а только что вставленный не работает. И как это можно обойти или с этим бороться?
Ответить с цитированием
  #2 (permalink)  
Старый 18.01.2012, 19:26
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 09.07.2008
Сообщений: 3,873

getJSON выполняется асинхронно
Ответить с цитированием
  #3 (permalink)  
Старый 19.01.2012, 07:30
Новичок на форуме
Отправить личное сообщение для Vovan91 Посмотреть профиль Найти все сообщения от Vovan91
 
Регистрация: 18.01.2012
Сообщений: 3

как решить проблему с обращением к DOM?
Ответить с цитированием
  #4 (permalink)  
Старый 19.01.2012, 10:51
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Обращаться к элементу после его добавления, а не до.
Ответить с цитированием
  #5 (permalink)  
Старый 19.01.2012, 11:00
Новичок на форуме
Отправить личное сообщение для Vovan91 Посмотреть профиль Найти все сообщения от Vovan91
 
Регистрация: 18.01.2012
Сообщений: 3

Сообщение от Kolyaj Посмотреть сообщение
Обращаться к элементу после его добавления, а не до.
по идеи он должен был быть уже добавлен
Ответить с цитированием
  #6 (permalink)  
Старый 19.01.2012, 12:42
Аватар для SkyLight
Злюка-бобер
Отправить личное сообщение для SkyLight Посмотреть профиль Найти все сообщения от SkyLight
 
Регистрация: 21.03.2010
Сообщений: 438

Вы ошибаетесь, т.к.
Сообщение от Octane
getJSON выполняется асинхронно
__________________
In WEB We Trust
У всех есть своя темная сторона...
Ответить с цитированием
  #7 (permalink)  
Старый 19.01.2012, 12:59
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 03.04.2008
Сообщений: 6,245

alert(1);
$(id).click(function(){
	alert(3);//выполняется, когда пользователь кликнет, а не сразу.
	$.getJSON(1,function(json){ 
		alert(5);//вызвалася, когда пришли результаты для обработки
		$(вставляю в начало элемента).prepend(<div id="a1">этот текст</div>);
		//Так как "4" уже выполнился, то пришедшую информацию надо обрабатывать тут, а не там
	});
	alert(4);//getJSON просто послал запрос, и повесил обработчик события, и код пошел дальше. обработчик события вызовется тогда, когда придут результаты с сервера
	$("#a1").animate({left: "+=377"}, 1000);
});
alert(2);//метод click просто повесил обработчик события, и код пошел дальше


методы click и getJSON Оба асинхронные.
Вам очевидно, почему сперва сразу выполняются 1 и 2, а вот 3 выполняется позже(когда был совершен клик)
Если бы после вызова click(), JS ждал бы этого клика, то никакой другой код не смогу бы выполнятся, и все зависло бы, пока пользователь не кликнет.
Аналогично, и getJSON
Он отправил запрос, и вызовет обработчик когда придется результат.
Если сервер медленный, то это может произойти через несколько секунд, или даже минут.
Если бы после отправления запроса JS ждал бы результата для того чтобы вызвать обработчик события ДО вашего кода анимации, то опять -таки все зависло бы на эти секунды или даже минуты, что не очень красиво
Хотя у getJSON в отличии от click есть такой режим работы(параметр async:true), но как я описал это очень плохая идея.

Привыкайте к событийно-ориентированной асинхронной модели

Последний раз редактировалось Gvozd, 19.01.2012 в 13:04.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Поюзайте хомячка Nanto Ваши сайты и скрипты 30 06.06.2011 21:16
Как (эффективно) изучать JavaScript? JSTalker Общие вопросы Javascript 33 23.12.2010 02:13
Удаление пустых текстовых нод работает только на верхнем уровне DOM exec Events/DOM/Window 13 20.09.2010 18:51
Отслеживание готовности DOM-структуры SleepWalker Events/DOM/Window 7 21.08.2009 16:59
Как узнать, что DOM сформирован dmeet AJAX и COMET 1 10.08.2009 16:09