0

我想以最简洁的方式在主干事件中使用 HoverIntent jQuery 插件。

以下是事件（为清楚起见进行了简化）：

events:
 'mouseenter'                      : 'onMouseEnter'
 'mouseleave'                      : 'onMouseLeave'

onMouseEnter: ->
  @$('.foo').show()      

 onMouseLeave: ->
  @$('.foo').hide()

基本上，我不希望当有人在页面上运行鼠标时出现和隐藏的古怪，所以 HoverIntent 似乎是要走的路。我已经包含在我的项目中，它已经准备好了……但我不清楚如何在主干视图中正确调用它。建议？

4

2 回答 2

1

有一些不同版本的 hoverintent 添加了您应该能够在 Backbone 中使用的自定义事件。看看：https ://github.com/LeMisterV/jquery.hoverintent 。您应该能够使用mouseenterintent和mouseleaveintent。

于 2013-02-01T03:43:13.897 回答
1

请注意，已接受答案中的插件不再维护并调用折旧的 jQuery 函数。$.event.handle.call(this.elem, this.event)通过替换$.event.dispatch.call(this.elem, this.event)插件的第 120 行，可以更新该插件以使用当前版本的 jQuery 。

然而，即使在修补了兼容性问题之后，我还是发现该插件对于我的目的来说过于故障和无响应。setTimeout相反，我通过检查元素是否仍然悬停来包装我的 mouseenter/mouseleave 回调来欺骗 hoverintent 功能集。例如：

function eventCallback(){
    setTimeout(function() {
        if ($(e.target).is(":hover")) {
            //do your code
        }
     }, 100);
}

根据您的喜好调整超时计时器，该功能仅在用户在一定延迟后继续悬停时执行。

于 2015-01-07T17:00:31.227 回答