Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.11.2014, 01:28
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

Перестают работать скрипты после добавления ajax-контента на страницу
Есть форум на PHPBB3, есть блоки в сообщениях, которые изначально свернуты и разворачиваются при наведении на них мышкой.

При добавлении нового сообщения через быстрой ответ с поддержкой ajax мой скрипт перестает работать для такого сообщения (аякс).

Как мне пояснил разработчик быстрого ответа
Потому что скрипты работают на той html-разметке, которая появилась после загрузки страницы, а не обновилась позже без перезагрузки.

Возможно ли перезагрузить скрипт для всей страницы при обновлении аякс? т.е. отключить мой скрипт и включить его заново, например по событию .ajaxComplete()? но именно предварительно отключить, чтобы не было двойного выполнения скрипта, подключенного в document ready.

на всякий случай приложу скрипт, который сейчас подключается в document ready
$('.postprofile').hover(function() {
		if ($(window).width() > 843) {
			$(this).find('.avatar img').stop(true, true).css({margin: '-20px 0 -40px 0'}).animate({margin: '0'},300);
			$(this).find('.profile-custom-field').stop(true, true).show(300);
			$(this).find('.profile-joined').stop(true, true).show(300);
			$(this).find('.profile-rank').stop(true, true).show(300);
			$(this).find('.profile-posts').stop(true, true).show(300);
				var txt1 = '<span id="temp_added_text" style="display: block; padding-left: 70px;"><br/>▲<br/><br/></span>';
			$(this).find('.profile-contact').append(txt1);
		}
	    }, function() {
		if ($(window).width() > 843) {
			$(this).find('.avatar img').stop(true, true).css({margin: '-20px 0 -40px 0'});
			$(this).find('.profile-custom-field').stop(true, true).hide();
			$(this).find('.profile-joined').stop(true, true).hide();
			$(this).find('.profile-rank').stop(true, true).hide();
			$(this).find('.profile-posts').stop(true, true).hide();
			$(this).find('#temp_added_text').remove();
		}
	});



если для иллюстрации нужна ссылка на страницу где можно посмотреть - приложу, если это не запрещено.

или может быть другое решение проблемы?

Последний раз редактировалось alecto, 18.11.2014 в 01:35.
Ответить с цитированием
  #2 (permalink)  
Старый 18.11.2014, 01:45
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

alecto,
поставьте ваш код на ближайший не перезаписываемый элемент выше

$('body').on('mouseenter', '.postprofile', function() {})
также для mouseleave
Ответить с цитированием
  #3 (permalink)  
Старый 18.11.2014, 01:53
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

сделал как вы посоветовали и, похоже все заработало!

$('body').on('mouseenter', '.postprofile', function() {
		if ($(window).width() > 843) {
			$(this).find('.avatar img').stop(true, true).css({margin: '-20px 0 -40px 0'}).animate({margin: '0'},300);
			$(this).find('.profile-custom-field').stop(true, true).show(300);
			$(this).find('.profile-joined').stop(true, true).show(300);
			$(this).find('.profile-rank').stop(true, true).show(300);
			$(this).find('.profile-posts').stop(true, true).show(300);
				var txt1 = '<span id="temp_added_text" style="display: block; padding-left: 70px;"><br/>&#9650;<br/><br/></span>';
			$(this).find('.profile-contact').append(txt1);
		}


})
 $('body').on('mouseleave', '.postprofile', function() {
		if ($(window).width() > 843) {
			$(this).find('.avatar img').stop(true, true).css({margin: '-20px 0 -40px 0'});
			$(this).find('.profile-custom-field').stop(true, true).hide();
			$(this).find('.profile-joined').stop(true, true).hide();
			$(this).find('.profile-rank').stop(true, true).hide();
			$(this).find('.profile-posts').stop(true, true).hide();
			$(this).find('#temp_added_text').remove();
		}
})


спасибо вам огромное!
Ответить с цитированием
  #4 (permalink)  
Старый 18.11.2014, 01:58
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

alecto,
может есть элемент ближе чем body - меньше нагрузка
Ответить с цитированием
  #5 (permalink)  
Старый 18.11.2014, 02:15
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

#posts - "обертка" всех сообщений на странице и, он ближе чем body.
попробовал - работает.
большая нагрузка получается?
Ответить с цитированием
  #6 (permalink)  
Старый 18.11.2014, 02:18
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

<div id="posts">
      <div id="p73275" class="post has-profile bg2 online">
         <div class="inner">
            <dl id="profile73275" class="postprofile">
            <div class="postbody">
            <div class="back2top">
         </div>
     </div>
     <hr class="divider">
   <div id="p73299" class="post has-profile bg1">
     <hr class="divider">
   <div id="posts_content">
   <div id="post_ajax">
</div>

Последний раз редактировалось alecto, 18.11.2014 в 02:20.
Ответить с цитированием
  #7 (permalink)  
Старый 18.11.2014, 02:25
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

если я правильно понимаю механизм, то события мыши вызываются для каждого элемента, входящего в #posts, а дальше выполняется проверка на принадлежность классу postprofile? т.е. таких вызовов могут быть сотни или тысячи, в зависимости от содержимого и количества сообщений?
в первоначальном варианте события мыши назначались максимум 10 элементам на странице.

или я ошибаюсь?
Ответить с цитированием
  #8 (permalink)  
Старый 18.11.2014, 02:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Сообщение от alecto
большая нагрузка получается?
всё зависит от количества элементов на странице среди которых 'наш'
Ответить с цитированием
  #9 (permalink)  
Старый 18.11.2014, 02:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

alecto,
браузер справится но чем меньше он будет делать бесполезных проверок тем лучше.
Ответить с цитированием
  #10 (permalink)  
Старый 18.11.2014, 02:28
Аспирант
Отправить личное сообщение для alecto Посмотреть профиль Найти все сообщения от alecto
 
Регистрация: 12.11.2014
Сообщений: 84

сообщения могут содержать десятки и сотни изображений со своими "обертками" дивами + текст со своим форматированием, видео и тд и тп.
т.е. минимум - сотни элементов, максимум - многие тысячи.
поэтому актуально...
Цитата:
если я правильно понимаю механизм, то события мыши вызываются для каждого элемента и их дочерних элементов, входящих в #posts, а дальше выполняется проверка на принадлежность классу postprofile? т.е. таких вызовов могут быть сотни или тысячи, в зависимости от содержимого и количества сообщений?
в первоначальном варианте события мыши назначались максимум 10 элементам на странице.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
После получения контента перестают работать скрипты, почему? Amateur jQuery 2 25.07.2012 01:35
После загрузки данных Ajaxom не работают скрипты simple AJAX и COMET 2 12.04.2011 08:21
После выполнения операции скрипт перестает работать HETmozgov jQuery 6 04.11.2010 18:06
Проблема с событиями после ajax запроса Mirgorod AJAX и COMET 5 12.06.2010 18:24
При подключении скрипта, перестают работать другие скрипты 365441010 Элементы интерфейса 1 30.01.2010 09:25