【问题标题】:Console error says global variable is undefined控制台错误说全局变量未定义
【发布时间】:2014-02-03 19:26:40
【问题描述】:

我正在使用这个插件http://almende.github.com/chap-links-library/js/timeline/doc/ 从一些 JSON 数据中呈现时间线。以下是完整的相关代码:

<script>
function doEverything() {
var timeline;

$.getJSON("tljson.json",function(result){
  items = [JSON.stringify(result)];
  drawVisualization();
});

function drawVisualization() {

var options = {'width':  '100%'};

timeline = new links.Timeline(document.getElementById('mytimeline'));
        timeline.draw(window.items, options);
 };
 }
</script>
<body onload="doEverything();">

当我提醒“window.items”时;它按预期显示。但是,检查器上的控制台显示

Uncaught TypeError: Cannot call method 'valueOf' of undefined 

而且时间线没有渲染。我做错了什么?

编辑:

console.log(JSON.stringify(result)) 的输出:

[{"content":"rubygem-aws-2.6.0 is available&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=863368'&gt;View on BugZilla&lt;/a&gt;","start":"863368"},{"content":"Recent update of rubygem-nokogiri breaks rubygem-aws-sdk&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=816706'&gt;View on BugZilla&lt;/a&gt;","start":"816706"},{"content":"Please update rubygem-aws-sdk to 1.3.5&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=800616'&gt;View on BugZilla&lt;/a&gt;","start":"800616"},{"content":"Review Request: rubygem-aws-sdk - AWS SDK for Ruby&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=723472'&gt;View on BugZilla&lt;/a&gt;","start":"723472"},{"content":"Please add EPEL branches for rubygem-aws&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=723152'&gt;View on BugZilla&lt;/a&gt;","start":"723152"},{"content":"Unable to resolve dependency of rubygem-aws-2.4.2.2-2.fc15 (updates)&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=716343'&gt;View on BugZilla&lt;/a&gt;","start":"716343"},{"content":"rubygem-aws-2.5.7 is available&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=703433'&gt;View on BugZilla&lt;/a&gt;","start":"703433"},{"content":"rubygem-aws-2.5.1 is available&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=703117'&gt;View on BugZilla&lt;/a&gt;","start":"703117"},{"content":"rubygem-aws-2.4.5 is available&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=691728'&gt;View on BugZilla&lt;/a&gt;","start":"691728"},{"content":"Update rubygem-aws to 2.3.34&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=668955'&gt;View on BugZilla&lt;/a&gt;","start":"668955"},{"content":"Review Request: rubygem-aws - Ruby gem for all Amazon Web Services&lt;br&gt;&lt;a href='https://bugzilla.redhat.com/show_bug.cgi?id=637378'&gt;View on BugZilla&lt;/a&gt;","start":"637378"}]

编辑:最新代码:(控制台仍为timeline.draw返回未知数据类型):

<script>
function doEverything() {
var timeline;

$.getJSON("tljson.json",function(result){
drawVisualization(result);
});

function drawVisualization(result) {
//console.log (JSON.stringify(result));
var options = {
            'width':  '100%'
        };

timeline = new links.Timeline(document.getElementById('mytimeline'));
    timeline.draw(JSON.stringify(result), options);
};
}
</script>
<body onload="doEverything();">

【问题讨论】:

  • 在 Chrome 中设置“中断所有异常”并查看实际原因。
  • items 不作为全局变量存在,直到执行为其赋值的代码行。在那之前,它是不存在的。这就是为什么您应该在适当的范围内声明全局(和所有其他)变量。
  • 我不认为这是问题所在,因为当我使用alert (window.items) 时,它会显示 JSON 数据的正确值。
  • 这是你的全部代码吗? bcoz 我不认为问题是窗口对象?

标签: javascript json chap-links-library


【解决方案1】:

您应该将项目作为参数传递给 drawVisualization。请不要计划将变量添加到全局命名空间。这是更正后的代码:

<script>
  function doEverything() {
    var timeline;

    $.getJSON("tljson.json",function(result){
      drawVisualization(result);
    });

    function drawVisualization(items) {

        var options = {'width':  '100%'};
        console.log(items);
        var timeline = new links.Timeline(document.getElementById('mytimeline'));
        timeline.draw(items, options);
     }
   }
</script>
<body onload="doEverything();">

【讨论】:

  • 这不会改变任何东西:(我认为问题不在于声明,因为我可以使用alert(window.items)查看项目的内容
  • 验证你有这样的行:timeline.draw(items, options);
  • 那么问题应该出在时间线构建上。请按上述方式添加 console.log(items) 进行验证。
  • 我想我找到了问题所在。看,问题是当我调用timeline.draw中的数组时,又增加了一组[]。因此它返回未定义。但是,当我粘贴以 [{ 并以 }] 开头的 JSOn 的原始内容时,它可以工作。添加 [ 之前和 ] 之后返回与上述相同的错误。如何将 items 变量的值直接放入 timeline.draw
  • 很好,您找到了根本原因。我也想知道为什么要将 JSON 转换为字符串。更新了答案以反映变化。
【解决方案2】:

您的变量items 似乎无法识别,因为您尚未将其声明为全局变量。你可以先这样声明:

<script>
var items;

function doEverything() {
    var timeline;

    // rest of your code
}

【讨论】:

  • 这不会改变任何东西:(我认为问题不在于声明,因为我可以使用alert(window.items)查看项目的内容
猜你喜欢
  • 2020-07-01
  • 1970-01-01
  • 1970-01-01
  • 2018-05-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多