Question

尝试从HTML数据属性解析JSON时出错。这是我要解析JSON的div：

echo '<div class="udropdown" data-elements=\'{"option1" : "1", "option2" : "2" }\'></div>';

这是jQuery的一部分（它点击了，所以$(this)是必要的）

var ele = jQuery.parseJSON($(this).data('elements'));

但我一直收到这个错误：

未捕获的SyntaxError：意外的令牌o

Answer 1

来自the documentation for jQuery.data：

当data属性是一个对象（以'{'开头）或数组（以'['开头）时，jQuery.parseJSON用于解析字符串;它必须遵循有效的JSON语法，包括引用的属性名称。如果该值不能作为JavaScript值进行解析，则将其保留为字符串。

$(this).data('elements')已经将字符串中的JSON解析为对象。

jQuery.parseJSON(object)相当于jQuery.parseJSON(object.toString())，它会为您提供jQuery.parseJSON("[object Object")。

只需跳过手册parseJSON步骤即可。 jQuery已经为你完成了它。

Answer 2

很可能你已经有了一个解析过的对象。在这种情况下，parseJSON会尝试将您的输入视为字符串，只要它已经是对象，它就会被视为以下字符串：

[object Object]

或类似的。它认为符号[是某个数组的开头（它仍然是一个有效的JSON），o正是它不希望到达那里的原因，因为它必须是一个数字，布尔值，或其中一个符号'，"或{。

只需检查$(this).data('elements')的数据类型 - 它必须是一个对象。

尝试以下方法：

JSON.parse({})

将返回完全相同的错误。

Answer 3

$(this).data('elements')返回一个对象，因此您不必解析任何内容只需使用返回的ele，例如：

$('.udropdown').click(function(){
    var ele = $(this).data('elements');
    console.log(ele.option1, ele.option2);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="udropdown" data-elements='{"option1" : "1", "option2" : "2" }'>Click HERE</div>

来自HTML的jQuery的parseJSON无法正常工作

3 个答案: