2

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

<body>
   <div id="content">
   </div>
</body>

<script>
$(function() {
    $('#content').load('../include/index.php');
})
</script>

Проблема в том что если контент из файла index.php просто вставить в id="content" то jQuery методы работают хорошо, а если контент загрузить методом .load то многие функции перестают работать. Знаю что с помощью метода .live события сохраняют свою работоспособность.

Например:

$('button').live('click', function() {
    //Действие
})

Но как быть с функциями, особенно когда их много. Конечно можно скрипты подгружать и вместе с подгружаемым файлом, но это будет не правильно, зачем каждый раз подгружать скрипты.

Просто я использую jQuery плагин cookie и после загрузки контента через .load плагин cookie уже не работает.

Подскажите решение проблемы.

2
  • обработчики о которых вы говорите вешаются по загрузке основной страницы?
    – Gedweb
    10 фев 2013 в 17:36
  • 1
    .load() предназначен не для того чтобы грузить страницы целиком, а для того, чтобы обновлять какие-то данные без особых телодвижений, блок новостей там или набор баннеров. *держите скрипты в файлах .js грузите их через <script src= , если необходимо загрузить скрипт, читайте $.getScript - там есть пример как сделать кэширующий загрузчик.
    – zb'
    11 фев 2013 в 17:05

2 ответа 2

4

Для начала, про метод live() пора бы уже забыть, писалось сотни раз. Используете метод .on(). Во-вторых, при работе с динамически подгружаемым контентом, я бы рекомендовал делегированную обработку. К примеру, если у вас основной контейнер не изменяется, то вешаете событие отталкиваясь от него.

$('#container').on('click', '.elem', function(e){
    // ...
});

В таком случае, как бы переиндексируется внутренний код этого контейнера и находится нужный элемент. Злоупотреблять этим так же не надо, т.к. все эти телодвижения влияют на скорость. И старайтесь находить максимально близкий родительский элемент, а не body, к примеру.

6
  • > В таком случае после загрузки страницы на загруженный контент через .load скрипты не отреагируют. Не хотите ли вы сказать, что вы загружаете не часть контента, а всю страницу? Если нет, подгрузка контента не должна влиять на работу плагина jquery.cookie.js. Кроме того, почему бы не использовать LocalStorage? Или религия не позволяет? ))
    – Deonis
    10 фев 2013 в 18:13
  • Верно, у меня подгружается только часть контента но почему то jquery.cookie.js не срабатывает. Если бы подгружалась вся страница то таких проблем бы не было так как со страницей подгружались бы и скрипты. За LocalStorage спасибо. Подскажите если кто знает как хотя бы сформировать google запрос на эту тему, дабы черпнуть по больше инфы.
    – webkostya
    11 фев 2013 в 8:50
  • @Berserker, запрос по вашей проблеме? Так проблема, я практически уверен, частного характера. По ссылке, которую вы дали выше, понять что-то сложно. Выложите пусть и с ошибками, но работающий вариант, где у вас должна подгружаться страница, тогда можно будет как-то въехать в общую картину. Пока могу сказать, что для начала, надо поубирать из html весь js-код (типа onclick) и перенести всё в js-файл: "Котлеты отдельно, мухи отдельно". Повесить обработчики событий на ссылки, обернув всё в конструкцию DOMReady.
    – Deonis
    11 фев 2013 в 10:10
  • Вот ссылка mywork.zz.mu/metro здесь в файле js/applications.js который находится внизу html страницы стоит .load который подгружает контент в id="metro". В данный момент при перемещении блоков coockie не сохроняются, если же не подгружать контент, а просто его вставить в id="metro", то coockie срабатывают.
    – webkostya
    11 фев 2013 в 10:38
  • @Berserker, ну так порядок выполнения у вас в этом случае: сначала попытаться установить/проверить куки (файл jquery.sortable.js), а только потом - подгрузить контент (файл applications.js). Вот попробуйте в файле jquery.sortable.js подгружать контент в месте, которое я показал ниже. $(function() { // here, we allow the user to sort the items $(setSelector).load('include/index.php'); // вот в этом месте (!!!) $(setSelector).sortable({ // ....
    – Deonis
    11 фев 2013 в 15:25
0

Блин не поверишь но решение было таким

$(setSelector).load('../include/index.php', function() {
    restoreOrder();
});
2
  • @Berserker, Почему ж не поверю? )) Всё логично - после подгрузки контента, в коллбэке вызываете функцию.
    – Deonis
    11 фев 2013 в 17:03
  • Спасибо за направление моей извилины в правильном направлении )))
    – webkostya
    11 фев 2013 в 17:08

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.