Tại sao Chrome tăng mousemove trên mousedown?

Question

Tôi nhận thấy rằng trong Chrome (Tôi đang sử dụng Chrome 35.0.1916.114 [CẬP NHẬT: cũng xảy ra trong "35.0.1916.153 m"], Windows 7 64 bit) khi tôi nhấp vào nút bên trái không chỉ là mouseDown sự kiện lớn lên (như tôi mong đợi) nhưng cũng là một mouseMove.

Trong this fiddle nếu bạn nhấp vào phần tử đầu vào, bạn sẽ thấy chữ 'D' cho mỗi sự kiện chuột được hiển thị và ký tự 'M' cho mỗi mouseMove.

HTML:

<input id="txt" type="text"/> 
<p>Moves</p><p id="moves">0</p> 
<p>Downs</p><p id="downs">0</p> 
<p id="activity">Activity</p> 

JS:

$("#txt").mousedown(function() { 
    document.getElementById("activity").innerHTML +="D"; 
    update(false,true); 
}); 
$("#txt").mousemove(function() { 
    document.getElementById("activity").innerHTML +="M"; 
    update(true,false); 
}); 

function update(move, down) 
{ 
    var moves=document.getElementById("moves").innerHTML; 
    if (move) 
    { 
     moves ++; 
     document.getElementById("moves").innerHTML=moves; 
    } 

    var downs=document.getElementById("downs").innerHTML; 
    if (down) 
    { 
     downs ++; 
     document.getElementById("downs").innerHTML=downs; 
    } 
    var d=parseInt(downs); 
    var m=parseInt(moves); 
    if ((d+m)%25==0) 
    { 
     document.getElementById("activity").innerHTML +="<br>"; 
    } 
} 

Trong FF và IE11 khi con trỏ là trong các yếu tố đầu vào sau đó bạn sẽ có thể nhận được liên tiếp 'D's (ví dụ, một tăng lương nhấp chuột một sự kiện mouseDown duy nhất). Trong Chrome, mỗi lần nhấp chuột sẽ tăng mouseDown và hai sự kiện mouseMove.

Điều này không phải do bất kỳ sự rung lắc nhẹ của chuột khi tôi sử dụng bi xoay để con trỏ hoàn toàn cố định.

Có ai biết giải pháp cho việc này không?

Cảm ơn Dave

Answer 1

vấn đề xa lạ thực sự, tuy nhiên với một lá cờ nhỏ này có thể được phá vỡ: http://jsfiddle.net/3a28p7ek/

sự thay đổi là khá thẳng về phía trước, thiết lập ignoreNextMove để true trên mỗi chuột xuống và hủy xử lý di chuyển nếu cờ này được đặt, sau khi đặt lại cờ để các sự kiện di chuyển thông thường được xử lý đúng cách:

ignoreNextMove = false; 

$("#txt").mousedown(function() { 
    ignoreNextMove = true; 
    document.getElementById("activity").innerHTML +="D";  
    update(false,true); 
}); 
$("#txt").mousemove(function() { 
     if(ignoreNextMove) 
    { 
     ignoreNextMove = false; 
     return; 
    } 
    document.getElementById("activity").innerHTML +="M"; 
    update(true,false); 
});