Ссылка сохраняет фокус при щелчке по ней, а затем при перемещении мыши от нее. Но теряет фокус, когда я убираю ссылку, а затем перемещаю ссылку мыши и отпускаю мышь - PullRequest
Новая
       44

Ссылка сохраняет фокус при щелчке по ней, а затем при перемещении мыши от нее. Но теряет фокус, когда я убираю ссылку, а затем перемещаю ссылку мыши и отпускаю мышь

0 голосов
/ 28 августа 2011

http://jsfiddle.net/nicktheandroid/bD37R/2/

Я пытаюсь избавиться от элемента, который все еще находится в фокусе, если пользователь наведет курсор мыши на ссылку, но затем убирает мышь от ссылки - при этом все еще удерживая кнопку мышии отпускает кнопку мыши.Для меня это означает, что пользователь понял, что не хочет нажимать на ссылку, прежде чем отпустить кнопку мыши - поэтому он не отпустил кнопку мыши над ссылкой, а вместо этого убрал мышь от ссылки, а затем отпустилкнопка мыши.

Элемент может быть ссылкой или div / span с активным и фокусным стилями, он работает одинаково.

В моем примере, если я нажимаю на один изdivs действует так, как мне хотелось бы, но затем, когда я размышляю, это убирает фокус, что не должно происходить.Фокус должен быть удален только если пользователь mousedowns на ссылку / div, но затем перетаскивает мышь от элемента и затем отпускает кнопку мыши.Но я хочу, чтобы элемент сохранял стиль фокуса, если они щелкают по элементу, а затем после щелчка, наводят курсор мыши на элемент.Это моя проблема, если я щелкаю элемент, то после нажатия я убираю мышь с элемента, он теряет фокус.Я знаю, что мой jQuery не прав, по какой-то причине мне трудно понять, как должен выглядеть jQuery. 

$('div').mousedown(function(){
    $(this).mouseleave(function(){
        if ($(this).mousedown()) {
            $(this).blur()
        }
    })
})

1 Ответ

1 голос
/ 28 августа 2011

Это лучшее, что я мог придумать.Не элегантно, но сделал работу.Проблема в том, что событие focus происходит при mouseup.Но вы не знаете, где произойдет событие mouseup.Поэтому мы должны отслеживать это, используя вместо этого глобальный.

http://jsfiddle.net/bD37R/4/

//keep track of whether the mouse is down or up
var mouseDown;
document.body.onmousedown = function() {
   mouseDown = true;
}
document.body.onmouseup = function() {
  mouseDown = false;
}    

//store currently selected element
var activeElement;

//on mouse leave check whether the mouse is down. if so store the element for
//release on mouse up
$('div').mouseleave(function() {
  console.log(mouseDown);
  if (mouseDown) { 
      console.log('blur');
      activeElement = $(this);
  }    
  else { activeElement = null; }
})

//release the element
$(document).mouseup(function() {
  if (activeElement) {
   console.log('active Element');
      activeElement.blur();
  }
});
...