Иногда требуется подгрузить скрипт на лету, в этом поможет технология 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
Тэги: ajax
