Javascript; 如何使函数可以全局访问？

Question

1. I am trying to learn from this stopwatch example. I would like to be able to start the stopwatch by clicking on another html element, that is not defined on this page.

2. How can I use the 'start' function elsewhere ( eg page reload etc. ) ?

    var Stopwatch = function(elem, options) { var timer = createTimer(), startButton = createButton("start", start), offset, clock, interval; // append elements elem.appendChild(startButton); reset(); // private functions function createTimer() { return document.createElement("span"); } function createButton(action, handler) { var a = document.createElement("a"); a.href = "#" + action; a.innerHTML = action; a.addEventListener("click", function(event) { handler(); event.preventDefault(); }); return a; } function start() { if (!interval) { offset = Date.now(); interval = setInterval(update, options.delay); } } // public API this.start = start; }; var d = document.getElementById("d-timer"); dTimer = new Stopwatch(d, {delay: 1000}); dTimer.start(); 

Q1: How will I be able to call the start function elsewhere ? Global ?

Answer 1

You can assign it to the window scope by doing:

window.functionName = function(){
  //your code here
}

Answer 2

If by "not defined on this page" you mean the browser page as in the HTML document, then this is impossible. As soon as you switch the page (or even reload the page) the code will run in a different context.

Assuming this is what you want, you could work around this by not actually leaving the page, but instead loading another page and replacing the current pages content.

If you are not leaving the page, your dTimer object should be globally accessible.

Answer 3

The problem was actually a misspelled "id" value.

Certainly it would be helpful to study javascript in detail, as Matias suggested.