苹果浏览器。拖动时光标错误

问题描述

我正在尝试向我的项目中添加拖放功能，并使用，我需要在拖动时禁用选择。我为此使用的JavaScript：

  list = document.getElementById（’demo1’）; 
 
 var flag_dragging = false; 
 list.addEventListener（'mouseover'，function（e）{
 document.onselectstart = function（）{return false;} 
}）; 
 
 list.addEventListener（'mouseout'，function（e）{
 if（！flag_dragging）{
 document.onselectstart = function（）{return true;} 
} 
}）； 
 
 list.addEventListener（'dragstart'，function（e）{
 flag_dragging = true; 
}）; 
 
 list.addEventListener（'dragstop'，function（e）{
 flag_dragging = false; 
}）; 
  

I'm trying to add drag-and-drop functionality to my project and using slip.js for this.

To decorate cursor I've add class="draggable" to each draggable <tr>. The CSS for this class is:

.draggable:active {
  cursor: -webkit-grabbing;
  cursor:    -moz-grabbing;
  cursor:         grabbing;
}

Drag-and-drop works fine, but in Safari when I'm dragging a table row the cursor looks like cursor: text

In Chrome the cursor is OK

Interesting that when I just click and hold without dragging the cursor is OK in Safari too

解决方案

As mentioned in chrome sets cursor to text while dragging, why?, I need to disable selection when dragging. My JavaScript for this:

list = document.getElementById('demo1');

var flag_dragging = false;
list.addEventListener('mouseover', function(e){
  document.onselectstart = function(){ return false; }
});

list.addEventListener('mouseout', function(e){
  if(!flag_dragging){
    document.onselectstart = function(){ return true; }
  }
});

list.addEventListener('dragstart', function(e){
  flag_dragging = true;
});

list.addEventListener('dragstop', function(e){
  flag_dragging = false;
});

这篇关于苹果浏览器。拖动时光标错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！