Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   $(document).append(data) где найти data ? (https://javascript.ru/forum/events/27419-%24-document-append-data-gde-najjti-data.html)

razerxxx 12.04.2012 14:25

$(document).append(data) где найти data ?
 
$('body').html($(html_from_ajax).html())

При таком подходе, если контент получен через ajax вызов, не выполняется javascript в нем находящийся.
После гугления нашел способ:
$(document).append($(html_from_ajax).find("#scripts_container"));
$('body').html($(html_from_ajax).html())

Поскольку этот контент может вызываться периодически - будет все время выполняться
$(document).append($(html_from_ajax).find("#scripts_container"))
,
что вобщемто мне и нужно (скрипт каждый раз заново инициализируется). Но куда записывается этот контент. Где его найти, затирается ли старое значение?
Или быть может, кто подскажет более изящное решение данного вопроса - При очередной загрузке страницы - выполнение javascript в ней находящегося?

p.s мои утверждения в данном посте - не совсем верны. Ошибка немного в другом месте. Смотри далее...

Le-mark43 16.04.2012 11:49

еле догнал в чем вопрос, наверное в силу своей малоопытности...
и у меня возникло больше вопросов чем ответов.
1. ты вообще уверен, что код, который ты вставляешь, вообще вставляется?
зная контент, можно это проверить (firebugом например), воспользовавшись поиском.
2. append($(html_from_ajax).find("#scripts_container" )) от такого я маненько в шоке, мне всегда казалось, что DOM сначала сформироваться должен, только потом на него подобные методы можно навесить, ну чтож... запомним такой подход.
3. $(html_from_ajax) что это такое?
если ссылка на функцию, которая выполняет Ajax запрос, то что в ней .find("#scripts_container") cможет найти? ведь функция как минимум не объект DOM.

может есть смысл разбить на составляющие:
1.сначала выполнить функцию ajax запроса и по Callback вставить контент куда надо. пусть будет <div id='html_from_ajax'>
2. собссно применить .find:
$('#html_from_ajax').find("#scripts_container")

razerxxx 16.04.2012 13:28

1. Код вставляется - так как выполняется яваскрипт.
3. html_from_ajax - строка содержащая html код, которая получена от сервера через ajax запрос. Например:
$.get('server_url', {key1: data1}, function(html_from_ajax) { 
    console.log(html_from_ajax)
})


2. Поэтому можно писать так:
append($(html_from_ajax).find("#scripts_container" ))

По другому можно было бы написать так:
var append_data = $(html_from_ajax).find("#scripts_container");
$(document).append(append_data);

Вобщем я так пишу для краткости кода, если это не сильно влияет на читаемость. Думаю у неновичков такая форма записи не вызовет вопросов. Начинающим пожалуй так писать не стоит, и лучше разбивать все действия на части.

razerxxx 16.04.2012 13:31

Цитата:

Сообщение от Le-mark43 (Сообщение 169324)
может есть смысл разбить на составляющие:
1.сначала выполнить функцию ajax запроса и по Callback вставить контент куда надо. пусть будет <div id='html_from_ajax'>
2. собссно применить .find:
$('#html_from_ajax').find("#scripts_container")

Вобщем я думаю что нашел оптимальное решение. Как доберусь до скрипта, отпишу здесь ответ.

Le-mark43 16.04.2012 14:15

Цитата:

Сообщение от razerxxx (Сообщение 168556)
По другому можно было бы написать так:
var append_data = $(html_from_ajax).find("#scripts_container");
$(document).append(append_data);

тогда уж:
var append_data = $(html_from_ajax).find("#scripts_container").html();


Но всеравно сомнения у меня, вроде для find нужен конкретный родитель, типа $("#div_main").find('#div').
надо проверить... с кодом в селекторе-родителе.
Цитата:

Сообщение от razerxxx (Сообщение 168556)
Думаю у неновичков такая форма записи не вызовет вопросов. Начинающим пожалуй так писать не стоит, и лучше разбивать все действия на части.

полностью согласен, ведь я новичок :)

razerxxx 16.04.2012 20:31

Цитата:

Сообщение от Le-mark43 (Сообщение 169341)
тогда уж:
var append_data = $(html_from_ajax).find("#scripts_container").html();


Но всеравно сомнения у меня, вроде для find нужен конкретный родитель, типа $("#div_main").find('#div').
надо проверить... с кодом в селекторе-родителе.

вот при такой записи в данном случае теги script будут вырезаны jquery.
Насчет $("#div_main").find('#div').
попробуй так:
var test_div = $("<div><div class="wrapper"><div id='find_me'>i am here</div></div></div>")
console.log(test_div.find("#find_me").text()); // должно вывести i am here

razerxxx 16.04.2012 20:41

собственно ответ на свой же вопрос:
Например в загруженной страничке есть тег script, - если сделать так: console.log($('body').html()); - то мы получим html докумена в котором будут и теги sript.
Если же мы сделаем так:
var new_html = $("<div><script>alert('it script')</script></div>");
console.log(new_html.html());

то не увидим в выводе тегов script. Вобщем во втором случае jquery выразает тэги script. То же самое произойдет если мы получили какой-либо html средствами ajax.
Моей задачей было получить новую страницу с помощью аякс загрузить ее в текущую страницу и выполнить все скрипты которые находятся на загруженной странице.
$.get('some_url.html', {key: value}, function(new_html) {

    var wrapper = document.createElement('div');
    wrapper.innerHTML = new_html;
    new_html = wrapper;
    $('body').html($(new_html).html());

})

Вот такой хак позволяет сделать так чтобы jquery не вырезал теги script.

P.S. Решение моей задачи верное, но предполагаемая причина оказалась ошибочной, см. далее

Le-mark43 16.04.2012 22:56

Цитата:

Сообщение от razerxxx (Сообщение 169434)
То же самое произойдет если мы получили какой-либо html средствами ajax.

Нееееее, ну неееееее.....
насчет concole.log не в курсе, но если ты вставляешь в див методом html(ajax_строка),
к твоему примеру:
$.get('some_url.html', {key: value}, function(new_html) {

    var wrapper = document.createElement('div');
    wrapper.innerHTML = new_html;
    document.body.appendChild(wrapper);
}, html);

все там обрабатывается, все скрипты, которые в теле, ничего jquery не вырезает. Специально проверял, у меня Аjax запрос грузит PHP скрипт у которого в теле еще 4 Аjax запроса на другие php, работает через $('#some_div').html(response);
специально менял на чистый Javascript для innerHTML, все работает, никаких изменений! даже создает и грузит все это дело в созданный див.
может ты спутал с функцией Load(), или text() вот они да, никаких скриптов.

Le-mark43 17.04.2012 00:19

еще как вариант, ну уж если ни в какую скрипты в теле не отрабатывают, хотя сами правильны, и в других местах работают, -> попробуй действовать скриптом в теле главного документа.
через livequery или delegate.
допустим:
ajax_строка:
<div><div class="wrapper"><div id='find_me'>i am here</div></div></div>

в теле главного документа:
<script>$(".wrapper").livequery(function(){
a=$(".wrapper").find('#find_me').text();
alert(a); //i am here
});</script>


но это конечно применимо токмо в том случае, если у тебя скрипты в теле ajax_строки примерно одинаковые, то бишь какие нить однородные функции.
суть: вешаешь эти функции через livequery, они срабатывают сразу при обнаружении Wrapper. естессно, livequery надо скачивать.
удобно тем, что для неё не надо указывать обработчик, как в случае с delegate. важна только пара объект.метод, потому при описанной декларации, функция срабатывает СРАЗУ, при появлении объекта в DOM

razerxxx 17.04.2012 02:47

какая у тебя версий jquery? насколько я помню раньше - у меня тоже все отрабатывало, а теперь перестало. Сейчас у меня jquery 1.7.1


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