如何将变量从php模板传递给javascript

我有一个页面，我想在地图上显示一些点。我有小模板（比如Smarty，但更轻），模板中有变量$ points，它由我需要的点的坐标组成。我需要将它们传递给javascript（因为只有javascript可以使用点呈现该地图）。如何将变量从php模板传递给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向）

我根本没有从模板文件中传递$this->points。我有一个处理我所有的AJAX请求另一个PHP文件：

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>

是，全局变量。但它就像整个应用程序的命名空间。

感谢大家。

来源

2011-06-07 Larry Cinnabar

**最好**根据什么标准？ – 2011-06-07 05:23:28

主要标准是速度和生产力。第二个标准是代码的“正确性”。我不希望我的代码被称为'怪异'或'异常'或其他东西;） – 2011-06-07 05:26:30

以下是一种方式：[Passing php varialbe]（http://stackoverflow.com/questions/6000871/passing-a-php -variable-in-external-js-file/6000973＃6000973） – Ibu 2011-06-07 05:28:56

第一种方式绝对是最简单和最快的。

第二个增加了一个额外的处理步骤（parseJSON()），这是不必要的。

如果您处理大量可选的数据（即仅在用户请求它时才需要，并且不能100％确定是否会发生这种情况）或动态处理，第三种方法很好。它虽然创建了一个新的请求，并不会立即可用。

如果你不想使用全局变量，你可以例如包装你的JavaScript函数为对象，从PHP填充一个对象的属性：

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

来源

2011-06-07 05:32:49

我想过了。这就像命名空间......谢谢 – 2011-06-07 05:38:20

第一个是最高效和最快的。第二个是时髦的。第三个也很好。

第一个，因为它不需要任何其他请求。第二个有点奇怪，我不会使用这种构造，但这并不意味着你不能。第三个也很好，但你应该考虑一下，如果AJAX是要走的路。如果您的应用程序需要针对不同位置的多个点数请求，那么它可能是最有效的方法。

来源

2011-06-07 05:32:17 Arend

我会与你的第二个方法去，因为你不希望使用AJAX它（这似乎很奇怪，使用AJAX的您在当前页面中已有的东西）。您想限制JavaScript中全局变量的数量，因为JavaScript中的所有内容都会创建每个全局变量的实例，从而降低性能。

我忘了这个人的名字，但是那个在Yahoo!上优化的人。然后去Google工作，做了关于JavaScript优化的讲座，这是他的一个观点。

编辑：找到链接：http://sites.google.com/site/io/even-faster-web-sites

来源

2011-06-07 05:34:32 Jon

可能你是在谈论道格拉斯克罗克福德，不是吗？ =） – 2011-06-07 05:40:10

我不会使用第二种方法 - 您避免使用全局方法，但必须将文本内容解析为JSON，而这种方式的性能明显要差得多。 – 2011-06-07 05:40:14

速度明智月1日的方式是最好的方式。

但最好的方法是从PHP创建XML输出并通过Ajax将该XML加载到Javascript中。这方面最好的例子是文章给出的谷歌地图文件 - http://code.google.com/apis/maps/articles/phpsqlajax_v3.html

来源

2011-06-07 05:36:35

有传递变量在一个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 
     .... 
    } 
}

来源

2011-06-07 05:36:50 Ibu

有趣的想法，但它打破了JS文件的缓存。 – 2011-06-07 05:37:29

这是正确的，如果缓存是一个问题 – Ibu 2011-06-07 05:41:19

仍然我不明白它......你如何获得脚本文件中的$ some和$ id以及'脚本'是什么？ – 2011-06-19 16:16:59

另一种方式：

在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>

没有全局变量，没有问题。

来源

2011-06-07 05:37:47

如何将变量从php模板传递给javascript

回答

相关问题