我正在构建一个使用查询的拖放方法
-onmousedown
导致-onmousemove(拖动)然后-onmouseup(unbinds onmousemove)
-onmousedown
导致-onmousemove(拖动)然后-onmouseup(unbinds onmousemove)
问题是,浏览器默认开始突出显示onmousemove,它会遍布整个页面并取消事件,使其无法使用.任何想法如何防止突出显示,因为preventDefault似乎没有工作.这是我的代码(是的,非常草率,对不起！)
$(".middleRow").mousedown(function(){
calculateSelection();
$('body').append('<div class="messageDrag" style="display:block">'+numSelected+'<div style="font-size: 18px">messages</div></div>');
$(document).mouseup(function(){
$('.messageDrag').fadeOut(500);
setTimeout(function(){
$('.messageDrag').remove();
},500);
$(document).unbind();
})
$(document).mousemove(function(e){
e.preventDefault();
var x = e.pageX;
var y = e.pageY;
$(".messageDrag").css("left",x-49);
$(".messageDrag").css("top",y-49);
});
});
解决方法
您可以使用css禁用突出显示
-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;
另一种方法是清除drop事件的选择,如下所示：
function clearSelection() {
var sel;
if(document.selection && document.selection.empty){
document.selection.empty() ;
} else if(window.getSelection) {
sel = window.getSelection();
if(sel && sel.removeAllRanges)
sel.collapse();
}
}
所以你会在drop事件上调用clearSelection()(拖动完成后)
