Question

关于自定义jQuery事件的问题很多。几乎所有人都只有建议使用$.fn.extend()的答案。
这是我的脚本，使用$.fn.extend()检测元素何时停止滚动：

$.fn.extend({
  scrollStopped: function (callback) {
    var $this = $(this)
    $this.scroll(function () {
      clearTimeout($this.data('scrollTimeout'))
      $this.data('scrollTimeout', setTimeout(callback.bind(this), 150))
    }.bind(this))
    return this
  }
})
$('element').scrollStopped(function () {
  alert('Scrolling has stopped')
})

就像这个问题的标题所暗示的那样，我想要的不是一个必须添加.scrollStopped()的事件，而是可以使用.on()方法添加的事件，就像这样：

$('window').on('scrollStopped', function () {
  alert('Window has stopped scrolling')
})
$('div').on('scrollStopped', function () {
  alert('Div has stopped scrolling')
})

我一直在扫描 jQuery source ，试图找到一种方法。在将一小段代码复制粘贴一两个小时后，我决定在SO上寻找答案，这很难找到。 This answer 对我有所帮助，但是（就像我在一小时前在该答案的评论中说的那样），触发自定义事件的事件被硬编码到正文，然后发送给.on()方法所绑定的元素。
这种方法有两个问题：

事件逻辑仍然不是jQuery内部结构的一部分。这只是身体触发的事件的一部分（不是说违反交易的行为）
滚动事件（例如我要使用的滚动事件）不会冒泡，这意味着将事件从keydown转换为scroll无效

我从答案 here 中简化了小提琴。

我知道我可以使用本机事件并将useCapture设置为true来捕获页面上的所有滚动事件，但是在SO的任何地方都看不到任何答案来解释如何做我想做的事情，我认为值得一看。

我要这样做的唯一原因是因为我希望能够编写以下内容：

$(window).on('beforeunload scrollStopped', function () { savePageScroll() })

代替：

$(window)
  .on('beforeunload', function () { savePageScroll() })
  .scrollStopped(     function () { savePageScroll() })`

使用自定义事件扩展jQuery的.on（）方法

0 个答案: