将JSON字符串存储在输入字段值中

bsr*_*bsr 14 javascript jquery

如何将Json字符串存储在隐藏的输入字段中.好吧,我可以通过编程方式完成它,但是转发出错了.由于我的字符串适度长,很难逃脱"所有名称的字符.请解释它是如何以编程方式工作(阶段1),因为控制台输出看起来相同.

[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]test2.html:21 [{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}] test2.html:22 PASSED PHASE 1
jquery.min.js:16Uncaught SyntaxError: Unexpected end of input

谢谢,

BSR.


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Test</title> 
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
        <input type="hidden" id="jsondata" />
        <input type="hidden" id="jsondata2" value="[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]"/>


    <script >
            $(document).ready(function() {  

            myItems = [{"X":0,"Y":0,"W":0,"H":500},
                   {"X":358,"Y":62,"W":200,"H":500}]

            console.log(JSON.stringify(myItems));
            $("#jsondata").val(JSON.stringify(myItems));
            console.log(document.getElementById("jsondata").value);
            console.log("PASSED PHASE 1");

            var obj = jQuery.parseJSON($("#jsondata2").val());
            console.log(obj.length);    
            console.log("PASSED PHASE 2");           
        }); 
    </script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

编辑:

以下代码有效..不确定它是否正确.所以将一个很好的解释标记为答案.谢谢.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Test</title> 
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
        <input type="hidden" id="jsondata" />
        <input type="hidden" id="jsondata2" value='[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]'/>


    <script >
            $(document).ready(function() {  

            myItems = [{"X":0,"Y":0,"W":0,"H":500},
                   {"X":358,"Y":62,"W":200,"H":500}]

            console.log(JSON.stringify(myItems));
            $("#jsondata").val(JSON.stringify(myItems));
            console.log(document.getElementById("jsondata").value);
            console.log("PASSED PHASE 1");

            var obj = jQuery.parseJSON($("#jsondata2").val());
            console.log($("#jsondata2").val()); 
            console.log(obj[0].H);  
            console.log("PASSED PHASE 2");           
        }); 
    </script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

小智 10

你可以这样做,但是非常糟糕,HTML:

<textarea id="jsondata" sytle="display:none"></textarea>
Run Code Online (Sandbox Code Playgroud)

和JS

$(function(){

    var myItems = [{"X":0,"Y":0,"W":0,"H":500}, {"X":358,"Y":62,"W":200,"H":500}]

    $("#jsondata").val(JSON.stringify(myItems));

});
Run Code Online (Sandbox Code Playgroud)

  • 这是一个很好的解决方案,但它有一个小问题。如果值将包含一个 `"` 字符串,JSON 将会中断,因为 Textarea 会自动解码 HTML 实体,因此它将转换为 `"`。例如 `{ x: "a", y: "b"c"} ` 将转换为 `{ x: "a", y: "b"c"}` (2认同)

rat*_*eak 7

<input type="hidden" id="jsondata2" value="[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]"/>
Run Code Online (Sandbox Code Playgroud)

是不正确的.使用单引号'而不是"值字符串中的双引号来修复它(或转义")

<input type="hidden" id="jsondata2" value="[{'X':0,'Y':0,'W':0,'H':500},{'X':358,'Y':62,'W':200,'H':500}]"/>
Run Code Online (Sandbox Code Playgroud)

  • 另外,http://www.json.org/,到目前为止,我遇到的最常见的错误与对象键有关.在JSON中(与JavaScript不同),这些必须是双引号字符串.实际上,JSON中的所有字符串必须用双引号括起来(JavaScript也允许使用单引号; JSON不能).参考:http://simonwillison.net/2006/Oct/11/json/ (5认同)

rba*_*kar 4

html 标记无效...如果您对第一个 html(非工作的)运行 html 验证器,您会发现错误...