javascript中的意外令牌{答案

【问题标题】：unexpected token { in javascriptjavascript中的意外令牌{
【发布时间】：2016-05-24 18:21:36
【问题描述】：

我正在尝试使用 Django 和 highcharts 在网络上显示图表。

我已将 JSON 格式的对象作为 my_data 从 Python 文件传递到 HTML 文件中。为了使数据适合 highchart 模型，我必须在 JavaScript 中进行一些修改（将日期对象与值配对）。

我是 JavaScript 和 HTML 的新手，图表没有显示。

下面是我的 HTML 代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Example</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://code.highcharts.com/stock/highstock.js"></script>
    <script src="https://code.highcharts.com/stock/modules/exporting.js"></script>

    <script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
    <script type="text/javascript">
    var obj = {{ my_data | safe }};
    function parseDate(s) {
        var b = s.split(/\D+/);
        return new Date(Date.UTC(2016, --b[1], b[2]));
    };
    var lst = [];
    var date;
    for (date in obj) {
        var day_record = [parseDate(date['time']), date['pnl']];
        lst.push(day_record);
    };
    var result = lst.sort();

        $('#container').highcharts('StockChart', {
            rangeSelector: {
                selected: 1
            },
            title: {
                text: 'accumulated pnl'
            },
            series: [{
                name: 'pnl',
                data: result
            }]
        });
    </script>
</head>

<body>
    <h1> Accumulated pnl over time </h1>
    <hr>
    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</body>
</html>

my_data 可以像这样在网络上显示：

[{"pnl": -4214918.830000036, "time": "2016-03-23 00:00:00"}, {"pnl": -5223615.250000035, "time": "2016-03-28 00:00:00"}, {"pnl": 23250409.1, "time": "2016-01-20 00:00:00"}, {"pnl": 12716814.320000006, "time": "2016-02-25 00:00:00"}, {"pnl": -9925980.870001037, "time": "2016-04-06 00:00:00"}]

我已经通过控制台尝试了代码，并得到了以下错误。

VM683:1 Uncaught SyntaxError: Unexpected token {
    at Object.InjectedScript._evaluateOn (<anonymous>:145:167)
    at Object.InjectedScript._evaluateAndWrap (<anonymous>:137:25)
    at Object.InjectedScript.evaluate (<anonymous>:118:14)

如果有人能给我一些建议，我将不胜感激！

【问题讨论】：

“我的代码中一定有一些语法错误或其他错误” 以下是如何找出答案：打开控制台（在 Windows 上按 F12 或在 Mac 上按 Opt + Cmd + I）。编辑您的问题以包含您发现的任何错误。
感谢您的建议，但我很困惑为什么会有预期的令牌
您正在使用{{ my_data | safe }} 生成一些代码。你能告诉我们生成的代码是什么吗？我很有信心这就是你的问题所在。
是的。我将 my_data 转储到 json 并将其传递给 HTML 文件。 my_data 可以在网页上显示为字典数组，如我的问题中的第二个代码块所示。

标签： javascript django highcharts

【解决方案1】：

检查并与您的代码进行比较：

var obj = {{my_data|safe}};
function parseDate(s) {
  var b = s.split(/\D+/);
  return new Date(Date.UTC(2016, --b[1], b[2]));
};

var lst = [];
var date;
for(date in obj){
  var day_record = [parseDate(date['time']), date['pnl']];
  lst.push(day_record);
};
var result = lst.sort();

您的 $ 符号位置错误...

编辑

也不知道为什么要使用jQuery来调用最后一部分，我认为只需要做highcharts部分：

$('#container').highcharts('StockChart', {
  rangeSelector : {
    selected : 1
  },

  title : {
    text : 'accumulated pnl'
  },

  series : [
    {
      name : 'pnl',
      data : result
    }]
  });

应该也可以

【讨论】：

谢谢！但它仍然无法正常工作。 JQuery 的唯一方法是使用 "$" 吗？