В некоторых случаях может потребоваться передать PHP глобальные переменные в сценарий JavaScript . В этой статье я расскажу, как использовать переменные PHP в JavaScript и приведу несколько примеров.
Переменные PHP в JavaScriptСуществует целый ряд сценариев, для которых может понадобиться включить переменные PHP в код JavaScript . Например, когда страница сайта запрашивается пользователем, модуль PHP на сервере генерирует страницу, выполнив вычисления и отобразив все переменные страницы в окне браузера.
После того, как загрузка страницы завершена, вы больше не контролируете ее (за исключением случая, когда у вас есть сервер на основе временных операций ). Но если во время загрузки страницы вы передаете переменные PHP в код JavaScript , то можно продолжать использовать их внутри скриптов JS и управлять отображением страницы и ее динамическим поведением.
Теперь рассмотрим, как можно передать переменные из JavaScript в PHP или наоборот.
Как передать переменные PHP во встроенный JavaScriptСуществует два основных метода включения кода JavaScript на странице HTML . Первый — мы располагаем код на той же странице, в разделе или в . Предположим, у нас есть встроенный код JS в разделе , и мы хотим передать переменную PHP username в JavaScript . В этом случае мы нужно использовать следующий код:
var username = ""; alert(username); ...
Мы определили в JS новую переменную и назвали ее username . Затем присвоили этой переменной JS PHP переменную $username , повторив ее. Естественно, переменная $username должна быть определена ранее на странице выше данной строки.
Обратите внимание, что вокруг кода PHP , который выводит $username , мы использовали двойные кавычки (« ) как при объявлении переменной в JS . Если переменная PHP является числом, то кавычки использовать не нужно. Но убедитесь, что вы правильно использовали кавычки, потому что строка вывода также может содержать кавычки, и это разобьет код JS .
Как передать переменные PHP во внешний JavaScriptТакже JS код может храниться во внешнем файле (например, script.js ), связанном со страницей HTML . Например, если вы хотите передать значение переменной времени (в секундах ) в таймер JS , можно использовать следующий код:
var seconds = ; ...
Код во внешнем файле JS (script.js ):
setTimeout(function() { window.location.href = "/"; }, seconds * 1000);
В приведенном выше коде мы сначала инициализируем значение PHP переменной $seconds переменной JS seconds . После этого переменная становится доступной в DOM , и подключаемый скрипт (script.js ) может использовать ее. В приведенном выше примере пользователь перенаправляется на главную страницу после установленного промежутка времени.
В большинстве веб-приложений статические JavaScript-файлы устраивают разработчика на 100%. Однако же иногда бывает лучшим решением подключить PHP и сгенерировать содержимое JS-файла «на лету» (например, получить актуальные цены на продукты из БД и передать их JavaScript-программе для валидации формы заказа). Как же это сделать?
Способ первый: простой Конечно же, самое простое решение состоит в том, чтобы включить код PHP внутрь секции вашего HTML-шаблона, поскольку есть шансы, что у него будет расширение.php.
var jsVar = "";
Даже если расширение шаблона.htm или.html, то в большинстве случаев веб-сервер настроен так, чтобы понимать включения PHP-кода (если же нет, то в конце заметки есть простой пример как решить и эту проблему). Но что касается красоты, то этот вариант не самый изящный. Хорошо бы держать мух и котлеты раздельно.
AddType application/x-httpd-php .js AddHandler x-httpd-php5 .js
Pro et Contra: что нам это дает? ProAddType application/x-httpd-php .htm .html
AddHandler x-httpd-php5 .htm .html
SetHandler application/x-httpd-php
Замечания, дополнения и обмен опытом приветствуются.
Инструкция
Скрипты JavaScript - это сценарии, которые выполняется не на сервере, а непосредственно в браузере, поэтому их называют «клиентскими». Если скрипт попал к вам в виде отдельного файла с расширением "js", то подключить его к странице надо добавлением в заголовочную часть ее HTML-кода соответствующего тега со ссылкой на этот файл. Заголовочная - это та часть, которая начинается с тега и завершается тегом . Поэтому вы не ошибетесь, если найдете в коде страницы закрывающий тег и поместите перед ним такую ссылку на JavaScript-файл:Здесь в атрибуте src указано имя файла "script.js" - его вам надо заменить на имя вашего js-файла. Чтобы браузер мог найти и прочесть этот файл, его нужно поместить в ту же папку сервера, где лежит и сама страница. Если вы закачаете его в другое место - укажите соответствующий адрес вместе с именем файла в атрибуте src.Если JavaScript у вас есть не в отдельном файле, а просто в виде текста, начинающегося с тега
На что здесь стоит обратить внимание ? Кавычки . Если вы используете внешние кавычки в виде " ", то внутренние кавычки элементов должны быть " " и наоборот, иначе вы получите ошибку. Если вы принципиально хотите использовать одинаковые и внешние, и внутренние кавычки, то во внутренних ставьте знак экранизации:
В этом случае все будет работать корректно.
Второй вариант вставки элементов в PHP-кодЭтот вариант мне нравится куда больше, чем первый. Здесь мы будем также использовать «echo », как и в предыдущем варианте, но добавим еще элемент «HTML »:
Сюда вы можете вставлять любой элемент, будь то HTML-код или же JavaScript. Кавычки здесь не играют роли (можете вставить любые), а по желанию можно внедрить переменные для вывода:
Весьма удобный способ для реализации ваших идей.