使用Javascript和PHP读取JSon字符串

我必须指出，您在HTML中犯了一个错误。您应该转义引号以避免破坏属性，例如，只需将它们替换为撇号：

<input id="page_json_language_index" type="hidden" value='[{"id":"label_accept_terms","fr":"En cliquant sur le bouton ci-dessous, vous accepter de respecter les "},{"id":"label_and","fr":" et la "},{"id":"label_birthdate","fr":"Anniversaire"},{"id":"label_bottom_about","fr":"'u00c0 propos de GayUrban"},{"id":"label_bottom_contact","fr":"Contactez-nous"},{"id":"label_bottom_copyright","fr":"'u00a9 2010-2013 GayUrban.Com - Tous droits r'u00e9serv'u00e9s"},{"id":"label_bottom_privacypolicy","fr":"Vie priv'u00e9e"},{"id":"label_bottom_termsofuse","fr":"Conditions d`...mon courriel"},{"id":"label_signon_twitter","fr":"Avec Twitter"},{"id":"label_slogan","fr":"LE site des rencontres LGBT !"},{"id":"label_terms_of_use","fr":"Conditions d`utilisation"},{"id":"label_title","fr":"Bienvenue sur GayUrban | LE site des rencontres LGBT !"},{"id":"label_transgender","fr":"Transgendre"},{"id":"label_username","fr":"Nom d`utilisateur"},{"id":"label_wait_create_profile","fr":"Un moment SVP, Cr'u00e9ation de votre profil en cours..."},{"id":"label_your_gender","fr":"Votre 'u00eate"}]'>

JSON.parse是转换JSON字符串的最佳方式，但它不受旧IE（例如IE6）的支持。您可以使用JSON2使其兼容，也可以简单地使用eval（）。

意识到滥用eval（）可能导致XSS（跨站点脚本）漏洞。确保要解析的JSON是安全的（不包括恶意Javascript）。

下面是一个读取所有id:的示例

<input id="page_json_language_index" type="hidden" value='[{"id":"label_accept_terms","fr":"En cliquant sur le bouton ci-dessous, vous accepter de respecter les "},{"id":"label_and","fr":" et la "},{"id":"label_birthdate","fr":"Anniversaire"},{"id":"label_bottom_about","fr":"'u00c0 propos de GayUrban"},{"id":"label_bottom_contact","fr":"Contactez-nous"},{"id":"label_bottom_copyright","fr":"'u00a9 2010-2013 GayUrban.Com - Tous droits r'u00e9serv'u00e9s"},{"id":"label_bottom_privacypolicy","fr":"Vie priv'u00e9e"},{"id":"label_bottom_termsofuse","fr":"Conditions d`...mon courriel"},{"id":"label_signon_twitter","fr":"Avec Twitter"},{"id":"label_slogan","fr":"LE site des rencontres LGBT !"},{"id":"label_terms_of_use","fr":"Conditions d`utilisation"},{"id":"label_title","fr":"Bienvenue sur GayUrban | LE site des rencontres LGBT !"},{"id":"label_transgender","fr":"Transgendre"},{"id":"label_username","fr":"Nom d`utilisateur"},{"id":"label_wait_create_profile","fr":"Un moment SVP, Cr'u00e9ation de votre profil en cours..."},{"id":"label_your_gender","fr":"Votre 'u00eate"}]'>
<textarea id="debug-console" cols="50" rows="20"></textarea>
<script type="text/javascript">
var arr = eval(document.getElementById("page_json_language_index").value),
    output = document.getElementById("debug-console");
//output all id
for(var i=0; i<arr.length; i++)
    output.value += [i, ": ", arr[i].id, "'n"].join("");
//show the first id
alert(arr[0].id);
</script>

实际上，您可以直接将JSON输出到Javascript。为了满足你的需求，我想这就是你需要的。

<?php
    ...
    $data = ...; //for example, from mysql query results
    $language = "fr"; //you can replace it with it/en/zh...
    ...
?>
<input id="some_id"></input>
<script>
(function() {
    var i18n = "<?php echo json_encode($data); ?>",
        lang = "<?php echo $language; ?>", //language
        data = eval(i18n); //you can also use JSON.parse/jQuery.parseJSON ...
    for(var i=0; i<data.length; i++) {
        document.getElementById(data[i].id).value = data[i][lang]; //a general way to read object's attribute in Javascript
    }
})()
</script>

我需要获得每个ID和VALUE 的单独变量

这不是办法，你不想用一堆变量污染你的范围。您所拥有的是一个集合（对象数组）。您可以循环这样的集合并访问所需的属性。

var input = document.getElementById('page_json_language_index');
var data = JSON.parse(input.value); // collection

目标是将（id，fr）值分配给jquery中的每一对标签

var label = function(lab) {
  return '<label id="'+ lab.id +'">'+ lab.fr +'</label>';
};
var labels = data.map(label);

您也可以将其作为jQuery集合：

var $labels = $(labels.join(''));

然后你可以将它附加到任何容器：

$labels.appendTo('body');