2015-04-04 288 views
0

我想設置一個svg元素的onmousemove事件。下面的代碼在Chrome中工作,但在Firefox中,它不會每次都正確設置onmousemove屬性。第二次更改後,它變得混亂了。Javascript事件處理函數參數

mysvg.setAttribute('onmousemove','window.updateXY(evt,' + that.chartNumber + ')'); 

mysvg仍然是正確的SVG元素根據螢火蟲:SVG#chart0

的SVG屬性的OnMouseMove說功能(E)代替的OnMouseMove(EVT),當它被搞砸了,但沒有錯誤報道螢火

編輯以顯示更多的代碼:

var YAxis = function(mysvg,chartNumber){ 
      this.chartNumber = chartNumber; 
      var that = this; 
      var g = document.createElementNS(xmlns, "g"); 
      this.id = 'YAxis' + chartNumber; 
      g.id = this.id; 
      mysvg.appendChild(g); 
      var shift = false; 
      this.selected = false; 


      this.yScale = function(e){ 
       e.stopPropagation(); 
       that.origY = e.pageY; 
       that.shift = e.ctrlKey; 
       mysvg.onmousemove = that.dragY; 
       mysvg.onmouseup = that.dropY; 
      } 

      this.dragY = function(e) { 
       var chart = charts[that.chartNumber]; 
       if(chart.log) 
        displayXYText.innerHTML = 'range: ' + Math.round(Math.pow(10,chart.max*(1 + (e.pageY - that.origY)/(chart.height)))*100)/100 + '-' + Math.round(Math.pow(10,chart.min*(1 - (e.pageY - that.origY)/(chart.height)))*100)/100; 
       else 
        displayXYText.innerHTML = 'range: ' + Math.round(chart.max*(1 + (e.pageY - that.origY)/(chart.height))*100)/100 + '-' + Math.round(chart.min*(1 - (e.pageY - that.origY)/(chart.height))*100)/100; 
      } 
      this.dropY = function(e) { 
       var chart = charts[that.chartNumber]; 
       if(that.shift){ 
        var range = (chart.max - chart.min)*Math.round((e.pageY - that.origY)/(chart.height)*1000)/1000; 
        chart.max += range; 
        chart.min += range; 
       }else{ 
        var range = chart.max - chart.min; 
        chart.max *= 1 + Math.round((e.pageY - that.origY)/(chart.height)*1000)/1000; 
        chart.min *= 1 - Math.round((e.pageY - that.origY)/(chart.height)*1000)/1000; 
        if(chart.max <= chart.min){ 
         chart.max = chart.min + range; 
        } 
       } 


       mysvg.setAttribute('onmousemove','window.updateXY(event,' + that.chartNumber + ')'); 
       //mysvg.onmousemove = updateXY(e,that.chartNumber);//function() { updateXY(e,that.chartNumber)}; //set back to orig function 
       //mysvg.setAttribute('onmousemove','updateXY(evt,' + that.chartNumber + ')'); 
       //console.debug(mysvg.onmousemove.textContent); 

       mysvg.setAttribute('onmouseup','window.mouseUp(event)'); 
       //console.debug("got here onmousemove"); 
       chart.redraw(); 
      } 

}

+0

什麼是'window.updateXY','evt'和'that.chartNumber'?如果'evt'應該是事件對象,則應該使用'event'。 – Oriol 2015-04-04 21:09:11

+2

使用'addEventListener()'作爲回調和'data-X'屬性來存儲chartNumber。 – Sirko 2015-04-04 21:10:21

+0

我認爲他需要展示更多的代碼。 – 2015-04-04 21:10:51

回答

0

我嘗試了上面的所有方法,但沒有在firefox中正常工作。解決方法是不要將除event以外的任何參數傳遞給updateXY函數。當其他參數未定義時,運行單獨的邏輯以確定在這種情況下參數應該是什麼。一旦代碼在window框架中,您可以像平常一樣使用setAttribute。 #FirefoxOOPfail

相關問題