如何將變量從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

回答

相關問題