2016-10-13 3 views
0

Для веб-сайта ресторана мне нужно работать с модулем бронирования, который является болью для загрузки.
Для загрузки скрипта требуется 4 секунды, и это связано с подключением к сети Ethernet 380 Мбит/с, с которым я работаю. Для функционирования веб-сайта требуется 4-6 секунд.Подождите, пока загрузится внешний, динамический загружаемый скрипт, чтобы загрузить скрипт

Это код, который я должен реализовать.

<div id="[reservation-company-name]-booknow"> 
    <script type="text/javascript" src="//www.[reservation-company-name].com/WID/Widget/Cors"></script> 
    <script>bookNow({companyID: '[numbers]',target: '#[reservation-company-name]-booknow',language: 'NL'});</script> 
</div> 

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

$(window).load(function() { 
    $("#[reservation-company-name]-booknow").append("<script type='text/javascript' src='//www.[reservation-company-name].com/WID/Widget/Cors'></script><script>bookNow({companyID: '[numbers]',target: '#[reservation-company-name]-booknow',language: 'NL'});</script> 
}); 

Проблема заключается в том, что второй скрипт с функцией bookNow срабатывает, когда первый скрипт все еще загружается. Это приведет к ошибке, и виджет не будет загружаться должным образом.
Виджет загружается, когда я устанавливаю тайм-аут при запуске второго скрипта, но с разной скоростью соединения невозможно установить правильное время таймаута.

Я искал здесь, в Stackoverflow, о том, как дождаться загрузки динамически загружаемого скрипта до выполнения функции. Большинство вещей, которые я нашел, не было связано с динамически загруженными сценариями или было связано с асинхронизацией и отсрочкой, что не сработало для меня.

Что делать?

+1

FYI, '$ (window) .load()' устарел. Используйте '$ (window) .on ('load')'. – Barmar

ответ

0

Ну, я нашел решение самостоятельно и просто хотел оставить его здесь для кого-то другого, чтобы найти, так как я не мог легко найти ответ здесь.

Jquery has a nice getScript function, который загружает скрипт и выполняет функцию. Именно то, что я искал.

$(window).load(function() { 
    var url = "//www.[reservation-company-name].com/WID/Widget/Cors"; 
    $.getScript(url, function() { 
     $('#[reservation-company-name]-booknow').append("<script>bookNow({companyID: '686937',target: '#[reservation-company-name]-booknow',language: 'NL'});</script>"); 
    }); 
}); 
Смежные вопросы