javascript - 使用 Javascript 和 PHP 读取 JSon 字符串

Question

在 Javascript 文件中，我将这个 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"}]">

来自用户语言的MySQL数据库(这个例子是法语(fr)，所以我需要在Javascript中访问每个“id”和这个“id”的每个值

示例:第一个“id”

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

var label = "label_accept_terms";和其他变量var value =“En cliquant sur le bouton ci-dessous，您接受者尊重”

所以我在读取时遇到问题，并影响了每个具有良好标签和值的 ID。

感谢您的帮助!

Answer 1

我必须指出您的 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>