2015-12-19 4 views
1

Задача состоит в том, чтобы перезагрузить div list со всем содержимым.Перезагрузка div с динамическим контентом с использованием jQuery

Содержание space и foo, которые также генерируются с помощью javascript.

<div id="list-wrapper"> 
    <div id="list"> 
     <div class="space"></div> 
     <div class="foo"></div> 
     <div class="foo"></div> 
     <div class="foo"></div> 
     <div class="space"></div> 
    </div> 
</div> 

Я пытаюсь использовать

$("#list-wrapper").load(document.URL + " #list"); 

, но это не работает должным образом - перезагруженный list пуст:

<div id="list-wrapper"> 
    <div id="list"> 
    </div> 
</div> 

Также я попытался

$("#list").load(document.URL + " #list"); 

Опять же, новый list пуст.

Каким образом это сделать?

Редактировать Чтобы прояснить задачу. Представьте, что мы вручную внесли некоторые изменения на веб-странице, открыв Chrome Dev Tools и удалив 1 из 3 foo. И после этого, мы хотим, что сценарий будет перезагрузить list DIV, чтобы показать все 3 foo «S, а не 2.

+0

Вы можете добавить более подробную информацию? Как вы загружаете его в первый раз? –

+0

Похоже, вы пытаетесь загрузить текущий '# list', который, по вашему мнению, пуст. – MinusFour

+0

@JesusAngulo Впервые он загружен не мной. Это какой-то плагин для Chrome. Первый раз он генерируется самим Chrome, а не мной. – jsv

ответ

0

$.load будет делать запрос HTTP на тот же URL и получить разметку без каких-либо Javascript применяется. Поскольку вы говорите, что #list заселяется javascript, тогда он будет пустым.

От JQuery docs:

При вызове .load(), используя URL без выражения с суффиксом селектора, содержание передается .html() до скрипты удаляются. Это выполняет блоки скриптов перед их отбрасыванием. Если .load() вызывается с помощью выражения селектора , добавленного к URL, однако, скрипты удаляются до обновления DOM и, таким образом, не выполняются.

Существует простой способ клонирования загруженных элементов .clone.

$('#list').clone().prop('id', '#list-wrapper').appendTo('body'); 
+0

Хорошо, это приносит свет актуальной проблеме. Спасибо, что поддержал. Но каков способ заставить его перезагрузить предварительно? – jsv

+0

Я только что добавил, имел небольшую ошибку. – MinusFour

+0

Хмм. Это создаст второй «список», точно (не перезагруженный) экземпляр первого. Во-первых, почему у меня есть 2 'list' вместо одного? А во-вторых, второе не перезагружается. Я обновил сообщение, чтобы он дал понять эту задачу. Во всяком случае, код, который вы опубликовали, был полезен. – jsv

0

Просто сначала удалите html div и загрузите новый html каждый раз.

$("#list").html().load(document. 

    URL+ "#list"); 

Существует разрыв в селекторе в Уре коде (то есть. #list)

Смежные вопросы