Intereting Posts

move_uploaded_file не удалось открыть поток и Permission denied error Форумы PHP – как справиться с непрочитанными дискуссиями / темами / сообщениями Выпадающий список из столбца MySQL с использованием mysqli Насколько это возможно, демон, написанный на PHP, с использованием ignore_user abort и set_time_limit (0) подготовленный оператор php mysqli Laravel 4 – Подключение к другой базе данных Перемещение фотографии, загруженной с помощью Dropzone.js и PHP Вставка Mysql только если предел не был достигнут Эхо внутри и Эхо PHP не отображает ошибки обновить определенную запись из списка массива mysql Как динамически получать значение тега select из таблицы MySQL Как распознать на PHP, что приложение Facebook было удалено .htaccess url переписать с переменными PHP – Сравнение времени

как передать переменную из шаблона php в javascript

У меня есть страница, на которой я хочу отображать некоторые точки на карте. У меня есть маленькие шаблоны (например, Smarty, но легче), и там в шаблоне у меня есть переменные $ points, которые состоят из координат точек, которые мне нужны. Мне нужно передать их в javascript (потому что только javascript может отображать эту карту с точками).

У меня есть 3 варианта этого. Можете ли вы сказать, что лучше?

1-й способ: (Шаблон, вставляющий javascript-теги с глобальной переменной)

Файл tpl.php:

<script> MAP_POINTS = <?php echo json_encode($this->points); ?>; </script>

.js файл

 function renderMap(){ var points = MAP_POINTS; // using global. Is it really bad? or who cares? =)) }

Второй способ: (Передача переменной через элемент HTML)

tpl.php.file

 <input type="hidden" value="<?php echo json_encode($this->points); ?>" id="map_points_container">

.js файл

 function renderMap(){ // without globals, but needed to be parsed on local side var points = $.parseJSON ( $( "#map_points_container" ).val() ); }

Третий способ: (AJAX-way)

Я вообще не пропускаю $this->points из файла шаблона. У меня есть еще один .php-файл, который обрабатывает все мои запросы AJAX:

Ajaxing.php

 function get_map_points($params){ // some operations return json_encode ($map_points); }

И чем на местной стороне, у меня будет что-то вроде этого:

.js файл

 $.post ( 'ajaxing.php', params, function(points){ renderMap(points); }, 'json');

Третий способ – обычный, но если я уже передаю некоторые значения из шаблона на локальную страницу, тогда я могу передать и нанести точки карты. На самом деле, мне не нужно делать другой запрос только для этих точек карты (поэтому мне не нравится третий способ)

Но может быть, вы можете посоветовать мне по-другому? лучший способ?

То, как я выбрал:

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

 $(function(){ MAP_APP = {}; MAP_APP.some_prop = null; // some properties MAP_APP.some_method = function(){}; // some methods });

Поэтому в файле шаблона мне нужно расширить объект MAP_APP:

 <script> MAP_APP.points = <?php echo json_encode($this->points); ?>; </script>

Да, глобальная переменная. Но это как пространство имен всего приложения.

Спасибо всем.

Первый способ определенно наименее сложный и быстрый.

Второй добавляет дополнительный шаг обработки ( parseJSON() ), который не является необходимым.

Третий способ хорош, если вы имеете дело с большим количеством данных, которое является дополнительным (т. Е. Необходимо, только если пользователь запрашивает его, и он не уверен на 100%, что это произойдет) или динамический. Однако он создает новый запрос и не будет немедленно доступен.

Если вы не хотите использовать глобальные переменные, вы можете, например, обернуть функции JavaScript в объект и заполнить свойство объекта из PHP:

 <script> MyObject.MAP_POINTS = <?php echo json_encode($this->points); ?>; </script>

Есть еще один напуганный способ передачи переменных в внешний файл js 🙂

Ваш PHP-файл:

 <script type='text/javascript' src='script.js?id=0&some=<?php echo $whatever?>'></script>

и внутри вашего script.js вы можете получить эти значения:

 var scripts = document.getElementsByTagName('scripts'); // get your current script; for (var i=0,l=scripts.length;i<l;i++){ if(scripts[i].src.indexOf('script.js') !== -1) { // or your script name var query = scripts[i].src.substr(scripts[i].src.indexOf('?')+1); // now you can split the query and access the values you want .... } }

Первый – самый эффективный и быстрый. Второй – фанки. Третий тоже прекрасен.

Первый, потому что он не требует никаких других запросов. Второй – немного странный, я бы не использовал такие конструкции, но это не значит, что вы не можете. Третий тоже хорош, но вам стоит подумать, есть ли AJAX путь. Если для приложения требуется несколько запросов для точек в разных местах, это может быть наиболее эффективным способом.

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

Я забыл имя человека, но человек, который возглавлял оптимизацию на Yahoo! а затем отправился на работу в Google, дал лекцию о оптимизации JavaScript, и это было одним из его моментов.

EDIT: найдите ссылку: http://sites.google.com/site/io/even-faster-web-sites

Скорость мудрый 1-й путь – лучший способ.

Но лучший способ – создать XML-выход из PHP и загрузить этот xml в Javascript через Ajax. Лучшим примером этого является статья, приведенная в документации по картам google – http://code.google.com/apis/maps/articles/phpsqlajax_v3.html

Другой путь:

В script_that_defines_renderMap.js :

 function renderMap(points) { // take "points" as an argument }

А потом:

 <script src="script_that_defines_renderMap.js"/> <script> var mapPoints = <?php echo json_encode($this->points); ?>; renderMap(mapPoints); </script>

Нет глобальной переменной, без проблем.