'Uncaught SyntaxError: Unexpected token x in JSON at position 1' 嘗試解析 HTML 嵌入字符串 JSON 時

Question

我一直在嘗試將硬編碼的 JSON 字符串解析為可用的格式，但我找不到讓它工作的方法，得到“意外令牌”或只是奇怪的輸出。 使用的庫： jQuery 。 要存儲的數據是：

x:10
y,10

和

x:200
y:10

它存儲在名為data-pos的data屬性中，我嘗試了多種解決方案，如下所列：

令牌錯誤結果（所有組合） ：

使用的功能

JSON.parse(data);
$.parseJSON(data);
jQuery.parseJSON(data);

數據格式

data-pos="{'x':10,'y':10}"
data-pos="{'x':'10','y':'10}"
data-pos="{x:'10',y:'10'}"
data-pos="{x:10,y:10}"

只是奇怪的輸出（沒有解析） ：

使用的功能

alert(data);
    --> output: 
        !!DATA AS IS!!
        !!DATA AS IS!!

alert ('x: ' + data.x + ' y: ' + data.y); /* Using {x: 200, y: 10} format */
    --> outputs:
        x: undefined y: undefined
        x: {y'    <-- Yep, THIS. No typos. IDK what the hell is going on.

數據格式

data-pos="{'x':10,'y':10}"
data-pos="{'x':'10','y':'10}"
data-pos="{x:'10',y:'10'}"
data-pos="{x:10,y:10}"

源文件：

<html>    
    <head>
        <script>var devmode = true</script>
        <script>var loadExec=false</script>
        <script src="/files/js/jquery.min.js"></script>
    </head>
    <body id="body" class="selectable nooverflow">
        <div class="container hidden desktop">
            <div class="window selectable"  data-pos=!!DATA!!>
                <div class="titlebar">
                    <span class="titletext" onmousedown="movingW=true" onmouseup="movingW=false">Window 1</span>
                </div>
            </div>
            <div class="window" data-pos=!!DATA!!> 
                <div class="titlebar">
                    <span class="titletext" onmousedown="movingW=true" onmouseup="movingW=false">Window 2</span>
                </div>
            </div>
        </div>
        <link rel="stylesheet" type="text/css" href="/files/css/style.css">
        <script src="/files/js/core.js"></script>       <!-- irrelevant -->
        <script src="/files/js/subcore.js"></script>    <!-- irrelevant -->
        <script>        
            $(function () {
                $(window).on("load", function () {
                    $('.window').each(function (index) {
                        if (!loadExec) {
                            var data = $(this).data('pos');
                            //alert(data + "\nDatatype: " + (typeof data));
                            if (data) {
                                alert(data);

                                //PARSING HERE!! <----------

                                $(this).css({ 'top': data.y, 'left': data.x, position: 'absolute' });
                            }

                            loadExec = true;
                            $('.container').removeClass('hidden');
                        }
                    });
                });
            });
        </script>
    </body>
</html>

我一直在搜索，但我能找到的只是不成功或面向 ajax 的。 我只需要將此 JSON 字符串嵌入到一個屬性或某種內部 DOM 方式中。 我只是找不到解決方案。

謝謝你的時間！

Answer 1

在 JSON 中，引號必須是雙引號，並且所有屬性名稱都必須是字符串（例如，在引號中），因此您列出的數據格式都不正確。 這是正確的：

data-pos='{"x":10,"y":10}'

或者如果將屬性值放在雙引號中很重要，因為屬性的內容是 HTML 文本（人們往往會忘記），您可以使用" ：

data-pos="{&quot;x&quot;:10,&quot;y&quot;:10}"

...但僅當您絕對必須在屬性值周圍使用"而不是'時才這樣做。

有關 JSON 的詳細信息，包括字符串和屬性名稱必須使用雙引號這一事實，請參閱JSON 網站。

例子：

 console.log("a's data:", $("#a").data("pos")); console.log("b's data:", $("#b").data("pos"));

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="a" data-pos='{"x":10,"y":10}'></div> <div id="b" data-pos="{&quot;x&quot;:10,&quot;y&quot;:10}"></div>

'Uncaught SyntaxError: Unexpected token x in JSON at position 1' 嘗試解析 HTML 嵌入字符串 JSON 時

問題描述

1 個解決方案

解決方案1
18 已采納 2016-05-27 10:55:04

&#39;Uncaught SyntaxError: Unexpected token x in JSON at position 1&#39; 嘗試解析 HTML 嵌入字符串 JSON 時

問題描述

1 個解決方案

解決方案1 18 已采納 2016-05-27 10:55:04

'Uncaught SyntaxError: Unexpected token x in JSON at position 1' 嘗試解析 HTML 嵌入字符串 JSON 時

解決方案1
18 已采納 2016-05-27 10:55:04