ReferenceError：在Joomla模块中未定义count_1

Question

这是我的脚本：

<script>
  document.addEventListener("DOMContentLoaded", function(event) {
    var START_DATE_1 = new Date("July 18, 2016 10:30:00"); // put in the starting date here
    var INTERVAL_1 = 3; // in seconds
    var INCREMENT_1 = 1; // increase per tick
    var START_VALUE_1 = 0; // initial value when it's the start date
    var count_1 = 0;

    var msInterval_1 = INTERVAL_1 * 1000;
    var now_1 = new Date();
    count_1 = parseInt((now_1 - START_DATE_1)/msInterval_1) * INCREMENT_1 + START_VALUE_1;
    document.getElementById('counter_1').innerHTML = count_1;
    setInterval("count_1 += INCREMENT_1; document.getElementById('counter_1').innerHTML = count_1;", msInterval_1);
  });
</script>

我把它放在Joomla模块中。 Firebug说：“ReferenceError：count_1未定义”

为什么？我该如何解决？

Answer 1

您应该将函数而不是字符串传递给setInterval调用。传递字符串时，它在全局范围内执行，count_1变量仅存在于传递给addEventListener的回调函数的范围内。

<script>
  document.addEventListener("DOMContentLoaded", function(event) {
    var START_DATE_1 = new Date("July 18, 2016 10:30:00"); // put in the starting date here
    var INTERVAL_1 = 3; // in seconds
    var INCREMENT_1 = 1; // increase per tick
    var START_VALUE_1 = 0; // initial value when it's the start date
    var count_1 = 0;

    var msInterval_1 = INTERVAL_1 * 1000;
    var now_1 = new Date();
    count_1 = parseInt((now_1 - START_DATE_1)/msInterval_1) * INCREMENT_1 + START_VALUE_1;
    document.getElementById('counter_1').innerHTML = count_1;
    setInterval(function() {
      count_1 += INCREMENT_1;
      document.getElementById('counter_1').innerHTML = count_1;
    }, msInterval_1);
  });
</script>

Answer 2

当您将一个字符串作为第一个参数传递给timers函数时，它们实际上创建了一个脚本对象，并将其作为源：

[除此以外]

执行HostEnsureCanCompileStrings（callerRealm，calleeRealm）。如果抛出异常，则报告异常。

让脚本源成为第一个方法参数。

设置对象是方法上下文的环境设置对象。

让脚本成为使用脚本源和设置对象创建经典脚本的结果。

运行经典脚本脚本。

https://html.spec.whatwg.org/multipage/webappapis.html#dom-setinterval

因此，它并不像eval那样实际上可以访问函数的范围。脚本对象应该可以访问全局范围。它失败的原因是因为它通过count_1查找全局范围内的count_1 += INCREMENT，因为它找不到并因此返回ReferenceError。

避免此类错误的最佳方法是不使用字符串作为计时器函数的参数。