對象的全局變量

this.timer

它不是「全球性」，所以當我點擊停止按鈕變量的值是錯誤的。
如果我聲明一個全局變量MyObject（loke var mytimer;）並使用它來替代this.timer，它就可以工作。

這是我的代碼：

<html> 
    <head> 
     <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
     <title></title> 
     <script type="text/javascript" language="JavaScript">    
      var MyObject = { 

       init: function(){ 
        this.timer = 0; 
        document.getElementById("btn1").onclick = function(){ 
         MyObject.RunIt(); 
        }; 
        document.getElementById("btn2").onclick = function(){ 
         clearInterval(this.timer); 
        }; 

       }, 

       RunIt: function(){ 
        var x=0; 
        this.timer = setInterval(function(){ 
       x++; 
         document.getElementById("spn").innerHTML=x; 
        }, 1000); 

       } 

      }; 


     </script> 
     <style type="text/css"> 
     </style> 
    </head> 
    <body onload="MyObject.init();"> 
     <input type="button" id="btn1" value="Run"/> 
     <input type="button" id="btn2" value="Stop"/> 
     <span id="spn"></span> 
    </body> 
</html>

來源

2010-02-13 mariki

「當我這樣做是錯誤的方式，它不工作」？我不明白你在問什麼...... – 2010-02-13 12:44:17

你在引用我嗎？ – mariki 2010-02-13 12:47:33

我問，爲什麼我沒有得到this.timer的真正價值，當我點擊停止按鈕。 – mariki 2010-02-13 12:48:30

問題是這樣的：當你設置「點擊」發送函數調用像這樣，在調用中沒有對象引用。瀏覽器調用你的函數來執行「clearInterval」，但「this」沒有指向你的對象 - 事實上，它指向了按鈕元素本身。

這裏有一個方法來解決這個問題：

var self = this; 
document.getElementById('btn2').onclick = function() { 
    clearInterval(self.timer); 
};

我知道＃2這個問題，提問者惱火，有時當人們敦促他們調查的jQuery或其他一些現代JavaScript框架，但它只是一個更好的做事的方式。

來源

2010-02-13 13:02:33 Pointy

@Pointy：關於你最後一句話，這只是你的意見。有很多情況下，我認爲最好不要使用其中一個大型JavaScript庫。 – 2010-02-13 13:13:09

關於jquery也許你是對的，但如果我想jQuery我會添加必要的標籤... – mariki 2010-02-13 13:14:35

@frunsi，所以這個答案也不好？ – mariki 2010-02-13 13:15:13

-1

~~您可以通過 this訪問對象僅當對象被創建 new。~~

~~的 this在你的代碼是指 window對象。~~ 在事件處理程序中它指的是相應的HTML元素。

Read a detailled explanation.

~~你myObject的聲明是一個對象，還是讓我們說，這是不是一個對象實例。 JS有區別。~~

對象實例例如：

 function MyClass() { 
       this.timer = 0; 

       this.RunIt = function() { 
         var x=0; 
         this.timer = setInterval(function(){ 
           x++; 
           document.getElementById("spn").innerHTML=x; 
         }, 1000); 
       }; 

       var me = this; // alias to current "this" 

       document.getElementById("btn1").onclick = function(){ 
        // "this" refers to btn1, use me 
        me.RunIt(); 
       }; 
       document.getElementById("btn2").onclick = function(){ 
        // "this" refers to btn2, use me 
        clearInterval(me.timer); 
       }; 
     } 

     var MyObject = new MyClass();

注意，有很多不同的方式來構建JavaScript對象。

EDIT：它包含另一個bug：事件處理程序功能將作爲HTML元素的成員來執行。所以處理程序中的this引用HTML元素，而不是您的對象。

編輯：固定的代碼

編輯：糟糕的一天，不聽我;-)

來源

2010-02-13 12:53:31 Frunsi

第一句話絕對不正確。 – Pointy 2010-02-13 12:54:42

是否有使用我使用的對象聲明的解決方法？ – mariki 2010-02-13 12:57:18

mariki：您可以將定時器放入您的MyObject聲明中，例如'var MyObject = {timer：0，...}'。但是你總是必須通過MyObject.timer來引用它 - 即使在RunIt和其他兩個函數中。 – Frunsi 2010-02-13 12:59:25

這是編寫JavaScript代碼的一個常見問題; 範圍。

在元件上的 .onclick方法

，所述範圍（本）是元件本身不是類你在（爲MyObject）。

我使用這種/那種方法;如下所示：

  init: function(){ 
       this.timer = 0; 
       document.getElementById("btn1").onclick = function(){ 
        MyObject.RunIt(); 
       }; 

       var that = this; 
       document.getElementById("btn2").onclick = function(){ 
        /** 
         Here i use 'that' instead of 'this'; 
         because 'this' is the button element 
        */ 
        clearInterval(that.timer); 
       }; 

      },

來源

2010-02-13 13:07:48 Alexar

對象的全局變量

回答

相關問題