/ Scripts & jquery / Загрузка JavaScript динамически

Загрузка JavaScript динамически

HIT

21.02.2016

2092

Иногда требуется подгрузить скрипт на лету, в этом поможет технология Ajax.

Обычный скрипт JavaScript динамически

Создаем файл скрипта script-dinamic.js с содержимым

// случайное число от 1 до 100  
var rnd = Math.floor(Math.random()*100+1);  
  
// выводим в контейнер content, добавляя уже к имеющемуся содержимому контейнера  
$("#content").html($("#content").html()+rnd+"
");

Создаем верстку

<form> <input type="button" value="Выполнить скрипт JavaScript" onclick="btnClick();"/> </form>
<div id="content"> </div>
<script>
function btnClick() {
$.getScript('script.js'); // вызываем скрипт
}
</script>

Загрузка скрипта формируемого из PHP

Тот же пример только script.js меняем на script.php

<form> <input type="button" value="Выполнить скрипт JavaScript" onclick="btnClick();"/> </form>
<div id="content"> </div>
<script>
function btnClick() {
$.getScript('script.php'); // вызываем скрипт
}
</script>

Содержимое script.php

<?php  
    // заголовок, который обозначает, что PHP будет генерировать  
    // JavaScript-файл в кодировке UTF-8.  
    header('Content-Type: text/javascript; charset=UTF-8');  
      
    // генерируем случайное число от 1 до 100  
    $rnd = rand(1,100);  
      
    // выдаем код скрипта в поток вывода  
    echo '$("#content").html($("#content").html()+'.$rnd.'+"
");';      
?>

Примеры

<form>  <input type="button" value="Выполнить скрипт JavaScript" onclick="btnClick();"/>  </form>  
<div id="content-dinamic"> </div>
<script>function btnClick() {  
       $.getScript('/wp-content/themes/tester/script-dinamic.js');   // вызываем скрипт  
        }</script> 

Обычный скрипт JavaScript динамически

Загрузка скрипта формируемого из PHP

[site-socialshare]
  • Похожие записи
  • Комментарии
  • Вложения
Загрузка контента без перезагрузки

Загрузка контента без перезагрузки

Подгрузка контента средствами Ajax Создаем тестовую верстку <p>Какую страницу желаете открыть?</p> <form> <input onclick="showContent('https://opttour.ru/main-rublik/sites/fotofit/')" type="button" value="Страница 1"> <input onclick="showContent('https://opttour.ru/main-rublik/sites/dtex/')" type="button" value="Страница 2"> </form> <div id="contentBody"></div> <div id="loading" style="display: none"> Идет Читать далее »

Подгрузка постов «налету» II: Кнопка

Подгрузка постов «налету» II: Кнопка

Данный вариант подгрузки постов «налету» является альтернативой подгрузке постов при скроллинге. Только в данном методе посты будут подгружаться по нажатию на кнопку. Также учтены некоторые особенности шаблона данного сайта высота Читать далее »

Автоматическое определение координат по адресу

Автоматическое определение координат по адресу

В данном решении используется сервис geocode-maps.yandex.ru. Функция определения координат по адресу my_url_encode, my_url_decode — вспомогательные функции по кодировке/декодировке символов для правильного url-запроса. Использование функции Ajax-функция определения координат Добавим функцию подключения Читать далее »

Добавить комментарий

Пока нет комментариев. Будь первым!

Загрузка JavaScript динамически
Multisite
Рекомендации для васMultisiteOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.