是否有一个事件触发jQuery中scrollHeight或scrollWidth的更改？

Question

我正在使用JQuery设计一个应用程序,用户可以在div中拖动元素,自动添加滚动条并根据需要扩展scrollHeight/scrollWidth.当更改容器div的scrollHeight和scrollWidth时,我需要触发一个偶数.

不,不想使用滚动事件,因为1)当您开始将元素拖到边缘并且scrollHeight/scrollWidth更改时,不会触发滚动.2)当scrollHeight/scrollWidth没有改变时滚动触发.

任何提示？

Answer 1

我不推荐jQuery,但有一个'resize'调度程序.

2017版JavaScript:

this.container = document.querySelector('#container');
this.watcher = window.requestAnimationFrame(this.watch);

this.watch = () => {
  cancelAnimationFrame(this.watcher);

  if (this.lastScrollHeight !== container.scrollHeight) {
    // do something
  }

  this.lastScrollHeight = container.scrollHeight;
  this.watcher = requestAnimationFrame(this.watch);
};

请参阅scrollHeight的文档及其相关内容scrollTop.查询scrollHeight可能会触发非性能DOM重新计算,并且手动管理高度/顶部position:absolute可能更快,因为它不是margins(for blocks)和其他CSS display类型的递归检查.

Answer 2

我在这里回答了这个问题,这似乎无关紧要,但它确实支持scrollHeight Change和scrollWidth.

使用jQuery检测div的高度何时发生变化

插入:

http://www.jqui.net/jquery-projects/jquery-mutate-official/

演示:

$('.selector').mutate('scrollHeight',function (){
    alert('it has changed the scroll height do something about it...');
});

这个插件也应该跨浏览器工作,因为它使用interval(setTimeout)来检查这些更改,如果你需要它也可以扩展:)

希望能帮助到你...