Магистральные события

Привет, мне было интересно, как я обрабатываю состояние удаления hover с помощью магистрали и js

в настоящее время у меня

events: {
  "hover .info"   : "hover"
},

hover:(e) =>
  $(e.currentTarget).css("background-color", "#333")

Мне было интересно, как бы я обработал событие, когда я удаляю мышь от элемента с классом .info

Если я делаю стандартный кофе script внутри, чтобы сделать это внутри обработчика hover: event, для его работы требуется 2 зависания.

Я в основном хочу подражать

$(".info").hover(
    function() {
       $(this).css("background-color", "#333")
    },
    function() {
       $(this).css("background-color", "#F3F")
    },
});

Спасибо

Ответы

Ответ 1

Существует версия hover(), которая выполняет одну функцию обратного вызова:

Описание: Привязывает один обработчик к согласованным элементам, которые должны выполняться, когда указатель мыши входит или покидает элементы.

Это версия hover, которая будет использоваться Backbone. Таким образом, вы можете справиться с этим с помощью toggleClass и нескольких классов CSS вместо прямого взаимодействия с css:

hover:(e) =>
  $(e.currentTarget).toggleClass('dark-gray')

По умолчанию цвет элемента #F3F будет установлен по элементу по умолчанию, и у вас будет:

.dark-gray {
  background-color: #333
}

в ваших таблицах стилей. Если вы не можете по какой-либо причине использовать toggleClass, вам придется привязываться к mouseenter и mouseleave индивидуально.

Ответ 2

В jQuery docs:

Вызов $(selector).hover(handlerIn, handlerOut) является сокращением для:

$(selector).mouseenter(handlerIn).mouseleave(handlerOut);

Итак, я думаю, что лучший способ справиться с этим с Backbone - это просто установить два события (извините, я не верю в CoffeeScript):

events: {
  "mouseenter .info"   : "hoverOn",
  "mouseleave .info"   : "hoverOff"
},

hoverOn: function(e) { ... },
hoverOff: function(e) { ... }

В качестве альтернативы вы можете использовать синтаксис одиночного аргумента, который принимает одну функцию и вызывает ее как внутри, так и снаружи - это хорошо работает с .toggle() и toggleClass().

Ответ 3

В этом точном примере, однако, вы должны действительно использовать css: hover pseudo class вместо jquery.

Ответ 4

Если это не ссылка действия, вы можете следовать css: pointer-events:none