Я не думаю, что этот вопрос был поставлен раньше, по крайней мере, не так, как мне было нужно. Я использую функцию .load jQuery. У меня проблема при загрузке только фрагментов страницы.
При использовании чего-то вроде:
$('#content').load('loadTest.html'); Все сценарии loadTest.html загружаются просто отлично. Однако при загрузке фрагментов страницы, например:
$('#content').load('loadTest.html #content');
скрипты удаляются до обновления DOM
Это четко описано в http://api.jquery.com/load/, где говорится:
Примечание. При вызове .load () с использованием URL без суффиксного выбора, содержимое передается в .html () перед удалением скриптов. Это выполняет блоки скриптов перед их отбрасыванием. Если, однако, вызывается .load () с добавлением селекторного выражения к URL-адресу, сценарии удаляются до обновления DOM, поэтому они никогда не выполняются. Пример обоих случаев можно увидеть ниже:
Я понимаю, что я мог бы просто загрузить скрипт, который можно использовать где угодно, но дело в том, что я использую систему ajax для всей страницы, где все загружается динамически. Поэтому мне не кажется, что у меня есть каждая функция javascript, которую я когда-либо буду писать (100 на данный момент) во внешних файлах. Тем более, что некоторые из этих функций javascript сделаны из значений, загружаемых из базы данных, которые я не могу зарегистрировать в файле .js.
Существует ли какое-либо обходное решение для снятия скриптов до обновления DOM? Могу ли я каким-то образом вручную загрузить их? Любой маленький пример был бы полезен для меня.
Как ты говорил. jQuery извлекает этот элемент перед выполнением только этого блока.
Вы можете изменить вывод, чтобы сервер возвращал данные в нужном вам формате или просто написал свой собственный. Он будет извлекать нужные вам элементы, выводя их в DOM.
Непроверенный, но это было бы так.
$('#content').load('loadTest.html #content,script');
Из памяти это более актуально ..
$.get('loadTest.html',function(r){ var els = $(r).find('#content,script'); $('#content').html(els); });
После вашего комментария, я думаю, вас может заинтересовать что-то вроде js / css lazyload . Он условно загружает скрипты, я использую его на некоторых небольших сайтах для загрузки только скриптов и CSS, когда мне это нужно на разных подстраницах или взаимодействии с пользователем.
Вы загружаете его один раз в голову:
<script src="js/lazyload-min.js" type="text/javascript"></script>
И тогда вы можете загружать скрипты каждый раз, когда вам это нужно, динамически, один из многих примеров:
// Load a single JavaScript file and execute a callback when it finishes. LazyLoad.js('http://example.com/foo.js', function () { alert('foo.js has been loaded'); });
Работает и с CSS-файлами.
Это может быть полезно в вашем случае, однако, это может изменить вашу логику загрузки. В любом случае, я думаю, что на вашем сервере обычно должно быть несколько конечных точек AJAX, которые будут возвращать только те данные, которые вы запрашиваете. В противном случае вещи могут стать конкретными и даже сложными.
Так что больше комментариев, чем настоящий ответ.