代码之家 › 专栏 › 技术社区 › Patrick Desjardins

将许多服务器端信息传递给javascript的最佳实践是什么?

javascript php

Patrick Desjardins · 技术社区 · 15 年前

假设我在页面内有很多javascript。此时,只需使用一些print/echo语句初始化javascript值,就可以很容易地初始化变量。

Example: var x = <?php echo('This is a value');?>

我首先认为我可以通过函数的参数传递所有变量的值,但这是不可能的,因为我们有很多值(我们有一个多语言的网站,所有的文本都来自服务器(bd))。

Example : initializeValues(<?php echo('Value1,Value2,Value3,Value...');?>);//JS Method that can be external of the page

当我们想从页面中去掉所有的javascript来移动所有的内容时,会出现更多的问题。 外部的 javascript文件。初始化所有这些变量的好方法是什么?如果我使用文档的onload绑定javascript方法,我将无法使用print/echo方法填充所有值。

有什么好的模式可以解决这个任务吗?

5 回复 | 直到 15 年前

bmargulies 15 年前

一个非常流行的模式是使用JSON格式。有一些库可以生成它,而javascript直接使用它。

John Boker 15 年前

使用php,您可以创建一个关联数组,然后使用json_encode将其序列化,以便在页面上的某些脚本标记之间输出。

关于这样做的一些例子,你可以看看 http://www.php.net/manual/en/function.json-encode.php

mmattax 15 年前

我是这样做的:


<?php

$foo = array('bar' => 'gork');

?>
<input id='foo' type='hidden' value='&lt?= json_encode($foo); ?>' />

然后客户端(我使用的是原型):


var foo = $F('foo').jsonParse();
alert(foo.bar);

bobince 15 年前

var x = <?php echo('This is a value');?>

呃,不,最后会是:

var x = This is a value

(语法错误。)您需要:

var x = <?php echo json_encode('This is a value', JSON_HEX_TAG|JSON_HEX_AMP|JSON_HEX_QUOT);?>

php 5.3中的十六进制标记转义避免了 </ 序列出现在 <script> 块。需要使用AMP和Quot编码来确保没有问题 " 和 & 将代码放入由分隔的属性值时的字符 “ 或非CDATA XHTML脚本块。如果您只使用HTML脚本块(或XHTML CData脚本块),则可以不使用它们(尽管它们也不会造成任何伤害)。

json_encode 还可以很高兴地对一个值数组进行编码以放入JS变量,而不仅仅是字符串。

More problem come when we want to take off all JavaScript from pages to move everything on external JavaScript file.

最好将所有静态代码(包括绑定到事件侦听器的代码)放在外部JavaScript文件中。但是,每页数据仍应保留在页面上,无论是在文档本身的适当属性中(例如,用于不引人注目的脚本的类名),还是在简单的 <script type="text/javascript">var data= ...;</script> 没有其他代码的块。

-1

just somebody 15 年前

最佳实践?将值从服务器传递到客户端JS对于单一的最佳实践来说太不稳定了。

假设你用的是聪明。然后, 我的最佳实践是:

<script type="text/javascript">
var limit = Number("{$limit}");
var msg = "{$msg}";

{literal}
// code using the variables
{/literal}
</script>

但我也认为这是一种非常明智的做法:

function to_js_vars(arrray $jsvars)
{
    foreach ($jsvars as $name => $info) {
        printf(
            "var %s = %s("%s");\n"
          , $name
          , $info['type']
          , $info['val']
        );
    }
}

在哪里? $info['type'] 是其中之一 Number ,请 Boolean 和 '' (空字符串)用于其他所有内容