seadragon自定義控件，與onClick事件處理程序：在IE中的問題

我使用Seadragon顯示一個大圖像，我已經添加了一些自定義控件，當我點擊這些控件時，我平移/縮放到一個圖像中的特定點。這適用於FF，Chrome和Opera。seadragon自定義控件，與onClick事件處理程序：在IE中的問題

IE雖然有問題。這就是我認爲是相關代碼：

 function makeControl(labelName) { 
      var control = document.createElement("a"); 
      var controlText = document.createTextNode(labelName); 

      control.href = "#"; // so browser shows it as link 
      control.className = "viewernav"; 
      control.id = labelName; 

      control.appendChild(controlText); 

      Seadragon.Utils.addEvent(control, "click", onControlClick); 

      return control; 
     } 

     function onControlClick(event) { 
      // don't process link 
      Seadragon.Utils.cancelEvent(event); 

      if (!viewer.isOpen()) { 
       return; 
      } 

      console.log(this); 

// problem occurs here: in FF, Chrome, Opera, this.innerHTML has the link text, which I use to retrieve from an array 
// the location and zoom for each "button" 

// in IE8, however, this.innerHTML does not seem to be populated. 

      viewer.viewport.panTo(new Seadragon.Point(navButtons[this.innerHTML].x, navButtons[this.innerHTML].y)); 
      viewer.viewport.zoomTo(navButtons[this.innerHTML].z); 
      viewer.viewport.ensureVisible(); 
     }

我添加了一個console.log(this)看什麼螢火蟲會告訴我關於被點擊的對象。在Firefox中，我得到

<a id="MyButtonName" class="viewernav" href="#" style="position: relative;">

但在IE8（使用Firebug精簡版），我得到

Window debug.html

這是我使用來測試這一切的html頁面的名稱。

問題：當我點擊一個在IE以及其他常用瀏覽器中工作的HTML元素時，如何獲取HTML元素信息？

來源

2011-09-11 Charlie Salts

這是IE中事件處理的一個已知問題。 DOM事件處理程序將「this」設置爲窗口而不是觸發事件的對象。不要使用'this'，請在onControlClick（）中執行以下操作：

function onControlClick(event) { 
    var target = event.target || event.srcElement; 

    // ... 

    viewer.viewport.panTo(new Seadragon.Point(navButtons[target.innerHTML].x, navButtons[target.innerHTML].y));

來源

2011-09-13 19:38:23 broofa

嘗試使用事件中的目標而不是此事件（event.target）。 SeaDragon的文檔相當稀少，但事件對象似乎是股票。

來源

2011-09-13 18:56:11

seadragon自定義控件，與onClick事件處理程序：在IE中的問題

回答

相關問題