爲什麼rеmоvеEvеntListеnеr不是？

我只想在按下鼠標按鈕時才能獲取鼠標位置。現在，它可以獲取座標，當我按我的鼠標，但是當我未按爲什麼rеmоvеEvеntListеnеr不是？

<!DOCTYPE HTML> 
<html> 

<head> 

    <body style="background-color:3F6E6F;"> 
    <style> 
     body { 
     margin: 0px; 
     padding: 0px; 
     } 
    </style> 
</head> 

<body> 

    <canvas id="myCanvas" width="1200" height="1000" onmousedown="mouseDown()" onmouseup="mouseUp()"></canvas> 
    <script> 
    function writeMessage(canvas, message) { 
     var context = canvas.getContext('2d'); 
     context.clearRect(0, 0, canvas.width, canvas.height); 
     context.font = '18pt Calibri'; 
     context.fillStyle = 'black'; 
     context.fillText(message, 10, 25); 
    } 

    function getMousePos(canvas, evt) { 
     var rect = canvas.getBoundingClientRect(); 
     return { 
     x: evt.clientX - rect.left, 
     y: evt.clientY - rect.top 
     }; 
    } 


    var canvas = document.getElementById('myCanvas'); 
    var context = canvas.getContext('2d'); 


    function mouseUp() { 
     canvas.removeEventListener('mousemove', mouseDown) 
     // alert('44') 
    } 

    function mouseDown() { 
     canvas.addEventListener('mousemove', function(evt) { 
     var mousePos = getMousePos(canvas, evt); 
     var message = 'Mouse position: ' + mousePos.x + ',' + mousePos.y; 
     writeMessage(canvas, message); 
     }, false); 
    } 
    </script> 
</body> 

</html>

它看起來像你的文章大多是代碼不能停止;請添加更多的細節。

來源

2016-11-28 кузьмич

即彈出，當你寫的問題是有沒有一個說理，所以你會真正說明問題，而不是僅僅發佈了大量的代碼 – adeneo

錯誤消息removeEventListener應該具有與回調函數完全相同的**函數 - 因此，將匿名函數轉換爲命名函數，然後在添加時以及刪除偵聽器時將其作爲回調函數提供 –

你要通過同樣的觀點function兩個addEventListener和removeEventListener，使其工作。試試這個：

function writeMessage(canvas, message) { 
 
    var context = canvas.getContext('2d'); 
 
    context.clearRect(0, 0, canvas.width, canvas.height); 
 
    context.font = '18pt Calibri'; 
 
    context.fillStyle = 'black'; 
 
    context.fillText(message, 10, 25); 
 
} 
 

 
function getMousePos(canvas, evt) { 
 
    var rect = canvas.getBoundingClientRect(); 
 
    return { 
 
    x: evt.clientX - rect.left, 
 
    y: evt.clientY - rect.top 
 
    }; 
 
} 
 

 
var canvas = document.getElementById('myCanvas'); 
 
var context = canvas.getContext('2d'); 
 

 
//create function here 
 
function move(evt) { 
 
    var mousePos = getMousePos(canvas, evt); 
 
    var message = 'Mouse position: ' + mousePos.x + ',' + mousePos.y; 
 
    writeMessage(canvas, message); 
 
} 
 

 
function mouseUp() { 
 
    //pass the same arguments 
 
    canvas.removeEventListener('mousemove', move, false) 
 
    // alert('44') 
 
} 
 

 

 
function mouseDown() { 
 
    //pass the same arguments 
 
    canvas.addEventListener('mousemove', move, false); 
 
}

body { 
 
    background-color: 3F6E6F; 
 
    margin: 0px; 
 
    padding: 0px; 
 
} 
 
canvas { 
 
    background-color: green; 
 
}

<canvas id="myCanvas" width="1200" height="1000" onmousedown="mouseDown(event)" onmouseup="mouseUp(event)"></canvas>

來源

2016-11-28 05:59:39 RizkiDPrast

您需要準確消除被addEventListerner Method.Like期間使用這種方式同樣的功能：

var newFunction = function (e){ 
console.log(e); 
} 
document.body.addEventListener('mousemove',newFunction,false); 
document.body.removeEventListener('mousemove',newFunction,false);

來源

2016-11-28 05:57:22

爲什麼rеmоvеEvеntListеnеr不是？

回答

相關問題