Как динамически включать html-файл, содержащий javascript

на моем сайте У меня есть простая панель навигации, где нажатие на различные элементы приводит к изменению основного содержимого. Технически все делается в одном файле «main.html», который содержит все, и я использую функцию загрузки jquery для динамической загрузки других html-файлов, чтобы поместить их в main.html. Это прекрасно работает, пока в этих html-файлах i не встроен javascript. Но есть один файл, который я хочу вставить, в котором также есть код javascript, который должен быть выполнен на $ (document) .ready. Но этого никогда не бывает - в javascript нет ошибки, он просто не запускается. Полагаю, это потому, что я только меняю DOM на «main.html», и тогда не будет запущено событие onReady. Может ли кто-нибудь дать мне некоторое представление о том, какой был бы лучший способ получить желаемое поведение? Размещение javascript в «main.html» приведет к тому, что все будет работать, но это не вариант для меня.Как динамически включать html-файл, содержащий javascript

Заранее благодарен!

обновление: проблема решена Проблема решена. Когда я вызываю javascript вне события onReady() (как предложил Лойк Коэнен), он работает так же, как и предполагалось. Я также удалил теги, обернутые вокруг. Огромное спасибо всем, кто помог мне!

источник

2013-09-01 fred madison

возможно использование iframe, но также не лучшая идея. – kangoroo

Что это за Javascript? Не могли бы вы разместить код, в который вы включили (или, по крайней мере, раздел JavaScript, который не выполняется)? Обратите внимание, что событие '$ (document) .ready' запускается только тогда, когда ваш main.html изначально готов, а не когда динамически загружается контент. – funkwurm

Вы можете вызвать пользовательское событие, чтобы уведомить ваш other.html скрипт, который загружается дерево. Я не пробовал, но я хотел бы использовать что-то вроде этого:

В main.html:

$('#div_to_load').load('other.html',{},function(){ 
    $('#div_to_load').trigger('loaded') 
})

В other.html

$('#div_to_load').on('loaded', function(){ 
    // Code to execute 
})

Я не знаете, может ли это сделать трюк.

Редактировать: Я предполагаю, что javascript, непосредственно включенный в ваш other.html, выполнен в любом случае.

источник

2013-09-01 10:10:18

Ваше предположение было правильным. Когда я вызываю javascript вне события onReady(), он работает так же, как и предполагалось. Я также удалил теги , обернутые вокруг. Огромное спасибо всем, кто помог мне! –

О, и убедитесь, что сценарий для выполнения помещен в конец вашего файла 'other.html', чтобы быть уверенным, что эти элементы существуют в вашей DOM, когда вам это нужно. –

Done :) Спасибо за совет, у меня действительно был сценарий сверху, и мне было интересно, почему некоторые вещи все еще были подключены, но после chaning все работает отлично :) –

Вы находитесь в main.html, который содержит головку, корпус. проблема может заключаться в том, что при загрузке страницы на вашей другой странице также есть голова, тело и т. д., если вы загружаете на div, это должен быть только код, также может быть javascript, но без головы или тела. но если вы сопротивляетесь, вот ваше решение

$("#loadnewpagebttn").load(location.href+" foobar ",function(){ 
    $.getScript("js/yourscript.js"); 
});

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

полный пример:

jQuery.getScript(url, [ success(data, textStatus) ]) 
url - A string containing the URL to which the request is sent. 

success(data, textStatus) - A callback function that is executed if the request succeeds. 

$.getScript('ajax/test.js', function() { 
    alert('Load was performed.'); 
});

http://api.jquery.com/jQuery.getScript/

источник

2013-09-01 09:56:20 WeTheBrains

Как динамически включать html-файл, содержащий javascript

ответ

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