无法获取onclick事件以在javascript中触发我的功能

Question

I'm working on an application that will allow me to click a button on the web page and then start my timer object. 我正在开发一个应用程序，允许我单击网页上的按钮，然后启动我的计时器对象。 However, the timer will not start onclick. 但是，计时器不会启动onclick。

<script type="text/javascript">
    var Timer = function()
    {   
    // Property: Frequency of elapse event of the timer in millisecond
    this.Interval = 1000;

    // Property: Whether the timer is enable or not
    this.Enable = new Boolean(false);

    // Event: Timer tick
    this.Tick;

    // Member variable: Hold interval id of the timer
    var timerId = 0;

    // Member variable: Hold instance of this class
    var thisObject;

    // Function: Start the timer
    this.Start = function()
    {
      this.Enable = new Boolean(true);

      thisObject = this;
      if (thisObject.Enable)
      {
        thisObject.timerId = setInterval(
        function()
        {
          thisObject.Tick(); 
        }, thisObject.Interval);
      }
    };
    // Function: Stops the timer
    this.Stop = function(){     
        thisObject.Enable = new Boolean(false);
        clearInterval(thisObject.timerId);
    };

  };
  //counts down the timer
  function timer_tick()
  {
    index  = index - 1;
    document.getElementById("blue").innerHTML =index;
    if (index === 0) 
    {
      obj.Stop();
    }
  }

If I remove function startBlue() but leave the code inside of it, the timer will run on page load. 如果我删除函数startBlue（）但将代码保留在其中，则计时器将在页面加载时运行。 So after looking at my code I think the issue is where I call startBlue (below in the html) or somewhere in this function. 因此，在查看我的代码后，我认为问题出在我调用startBlue（在html下面）或者在这个函数中的某个地方。

function startBlue(){
 var index = 300;
 var obj = new Timer();
 obj.Interval = 1000;
 obj.Tick = timer_tick();
 obj.Start();
}
</script>
<body>
<div id ="Objectives">
 Your Objectives:
 <br>
 <br>
 <label>Blue Buff:</label>
 <button id="yosb" onclick ="startBlue();">Start Blue</button>
 <h2 id = "blue">
  </h2>
 </div>
</html>

Answer 1

Your problem isn't the space, it is a scope and reference issue. 你的问题不是空间，而是范围和参考问题。

var index, obj;  //define index and obj outside of startBlue().
function startBlue(){
    index = 300;  //initialize without redefining (remove 'var').
    obj = new Timer();  //initialize without redefining (remove 'var').
    obj.Interval = 1000;
    obj.Tick = timer_tick;  // store the actual function in obj.Tick, not the return (remove the '()' from the end of timer_tick)
    obj.Start();
}

If you define a variable inside of a function, then that variable is only accessible inside the scope of that function only. 如果在函数内部定义变量，那么该变量只能在该函数的范围内访问。 By defining it outside, you allow that variable to be accessed from the outer scope. 通过在外部定义它，您可以从外部作用域访问该变量。

To store functions in variables, you must be sure not to include the parens at the end of the function name. 要将函数存储在变量中，必须确保不要在函数名末尾包含parens。 Otherwise the function will be executed first, and the return value will then be stored in the variable instead of the function it self. 否则该函数将首先执行，然后返回值将存储在变量中而不是自身的函数中。

Answer 2

The following line 以下行

<button id="yosb" onclick ="startBlue();">Start Blue</button>

Should be changed to 应该改为

<button id="yosb" onclick="startBlue();">Start Blue</button>

You are adding an unnecessary space between the onclick and the = . 您在onclick和=之间添加了不必要的空格。

无法获取onclick事件以在javascript中触发我的功能

问题描述

2 个解决方案

解决方案1
3 已采纳 2013-12-30 00:00:17

解决方案2
0 2013-12-29 23:45:38

无法获取onclick事件以在javascript中触发我的功能

问题描述

2 个解决方案

解决方案1 3 已采纳 2013-12-30 00:00:17

解决方案2 0 2013-12-29 23:45:38

解决方案1
3 已采纳 2013-12-30 00:00:17

解决方案2
0 2013-12-29 23:45:38