javascript - 未捕获的语法错误 : Unexpected end of input While doing JSON. 解析

标签 javascript php jquery html json

HTML 和 PHP:

<select id="package">
    <?php $package_size_array = array('size_a' => 70, 'size_b' => 90, 'size_c' => 130); ?>
    <option value="size" id="<?php echo json_encode($package_size_array, JSON_PRETTY_PRINT); ?>">Size</option>
    <!--Some more <option>s here...-->
</select>

JavaScript:

$(document).ready(function() {  
    $('select#package').change(function() {
        var id = $(this).children(':selected').attr('id');
        alert(JSON.parse(id)); /* Line 217. in functions.js file */
    });
});

问题:Chrome 和可能其他浏览器的控制台打印:

Uncaught SyntaxError: Unexpected end of input functions.js:217
(anonymous function) functions.js:217
jQuery.event.dispatch jquery.js:4371
elemData.handle

最佳答案

除非您要转换为 JSON 的数据仅包含 bool 值或数字,否则生成的 JSON 将包含 " 字符。

您正在使用 " 字符来分隔您的 ID 属性值,因此数据中的第一个字符将过早地结束该属性。

如果您检查发送到浏览器的数据(使用 view > source)而不是仅仅查看 PHP,这将更加明显。

您需要将 JSON 的文本表示形式转换为它的 HTML 表示形式。

id="<?php echo htmlspecialchars(json_encode($package_size_array)); ?>"

您还应该删除 JSON_PRETTY_PRINT,它对调试很有用,但在实践中效率低下,而且新行不适合属性值。


也就是说,使用 JSON 作为 ID 值是一个糟糕的主意。如果要在元素上存储任意数据,请使用 a data-* attribute (尽管如此,您仍然需要将文本转换为 HTML!)

关于javascript - 未捕获的语法错误 : Unexpected end of input While doing JSON. 解析,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24016213/

相关文章:

javascript - 如何使父菜单项仅在第二次单击时定向到其链接

php - Zend Framework 1.11.11 包含路径 open_basedir 问题

php - 文件名编码问题

javascript - 不确定是否调用了 d3.json 中的回调

javascript - 将 HTML 转换为 PDF 时如何在每个页面的底部添加页脚

php - 如何用正则表达式解析html标签?

jquery - 使用jquery检查多个复选框

jquery - 动画 - 从水龙头流出的水 - CSS3 和 jQuery 或 GIF

javascript - 我们如何根据选择选项发送电子邮件至

javascript - 按比例缩小的 div 会占据整个空间,您可以滚动浏览空白空间