我如何處理這些事件，爲什麼我的代碼無法工作？

我需要執行以下操作。只要用戶點擊一個div，我想保存鼠標的協調，而用戶將光標移到div上並按住鼠標左鍵。當用戶離開div或釋放左鍵時，我想停止記錄座標。我有以下代碼：我如何處理這些事件，爲什麼我的代碼無法工作？

$(document).ready(function() { 
      var coordhdl = new coordinateHandler(); 
      $("#test").mousedown(function(e) { 

       $("#test").mousemove(function(ee) { 

        $("#test").mouseup(function(e) { 
         stopIt = true; 
        }); 
        if(stopIt == false) 
        { 
         coordhdl.addCords(ee.pageX - this.offsetLeft, ee.pageY - this.offsetTop); 
        } 


       }); 

      }); 


     });

這段代碼的問題是：它記錄的座標即使用戶只點擊了DIV不按下左鍵。點擊後不會停止記錄座標。

我是新來javascript/jquery，所以我不太瞭解它。謝謝你的幫助。

來源

2011-08-16 Luke

像這樣的東西應該工作。當分別按下/釋放鼠標時，它將標誌設置爲真/假。當鼠標移動時，如果設置了標誌，座標補充說：

$(document).ready(function() { 
    var isDown = false, 
     coordhdl = new coordinateHandler(); 
    $("#test").mousedown(function() { 
     isDown = true; 
    }).mouseup(function() { 
     isDown = false; 
    }).mousemove(function(e) { 
     if(isDown) { 
      coordhdl.addCords(ee.pageX - this.offsetLeft, ee.pageY - this.offsetTop); 
     } 
    }); 
});

這裏是在行動類似一個demo（它只是將座標爲p元素，而不是使用您的coordinateHandler的對象）。

來源

2011-08-16 08:15:33

由於某些原因，這不適合我。其他2個答案也在這裏。當我釋放按鈕時它不停止錄製。你測試了這個代碼嗎？也許這個問題是我的瀏覽器。我正在使用IE 8 – Luke

@Luke - 是的，我在回覆中發佈的鏈接中進行了測試。看看這個，看看它是否適合你。 –

不要在事件處理程序中附加事件處理程序。在每次移動鼠標時，您都會附加一個新的事件處理程序mouseup。他們不會被覆蓋，他們會被追加。

使用「全球」標誌來代替：

$(document).ready(function() { 
    var coordhdl = new coordinateHandler(), 
     recording = false; 

    $("#test").mousedown(function(e) { 
     recording = true; 
    }).mousemove(function(e) { 
     if(recording) { 
      coordhdl.addCords(e.pageX - this.offsetLeft, e.pageY - this.offsetTop); 
     } 
    }).mouseup(function(e) { 
     recording = false; 
    }); 
});

來源

2011-08-16 08:14:52

每當有一個mousedown事件，添加一個mousemove處理程序，每次鼠標移動時，你增加一個mouseup處理。我看不到stopIt變量是在哪裏聲明的，所以這個變量的範圍也可能是一個問題。你不需要嵌套處理程序，所以試試這種方式。

$(document).ready(function() { 
     var coordhdl = new coordinateHandler(); 
     var isRecording = false; 
     $("#test").mousedown(function(e) { isRecording = true }) 
        .mouseup(function(e) { isRecording = false }) 
        .mousemove(function(ee) { 
        if(isRecording) 
        { 
         coordhdl.addCords(ee.pageX - this.offsetLeft, ee.pageY - this.offsetTop); 
        } 
        }); 
    });

來源

2011-08-16 08:15:30

我如何處理這些事件，爲什麼我的代碼無法工作？

回答

相關問題