Question

我的cshtml页面中div标签的overflow属性设置为auto。我在页面溢出发生变化时尝试运行javascript函数。例如，当页面很短时，没有滚动条，当它变长时，div的右侧会出现一个垂直滚动条。当页面再次变短时，滚动条消失。我发现这里link引入了overflowchanged事件，但它不起作用。经过一些搜索后，我发现它已被弃用，不再可用。现在我的问题是什么是替代它，如果没有，你有什么建议来解决我的问题？

Answer 1

对于 Firefox ，我们有overflow和underflow个事件。如果您只对溢出的更改感兴趣，可以让它们都调用相同的函数。

在下面的示例中，我添加了一些额外的行，让您通过切换<div>的内容来强制溢出事件。您也可以通过在完整页面视图中打开示例并调整浏览器窗口大小来手动触发事件。

＆＃13;

var el = document.querySelector('div'),
    text = el.innerHTML

el.addEventListener('click', function(){
    el.innerHTML = el.innerHTML == text ? "Click this to toggle length of the content. This is a long line of text forcing the contents of the element to overflow its dimensions. Eventually this will have scrollbars appear and fire the overflow event." : text
})

function overflowChanged() {
    console.log("Overflow changed")
}

el.addEventListener('overflow', overflowChanged)
el.addEventListener('underflow', overflowChanged)

// Or with jQuery you could go with a one-liner:
// $(el).on('overflow underflow', overflowChanged)

＆＃13;

div {
  width: auto;
  white-space: nowrap;
  overflow: auto;
}

＆＃13;

<div>
   Click this to toggle length of the content. Will fire an event when the overflow changes.
</div>

＆＃13;

什么是'overflowchanged＆＃39;的替代品？事件处理程序

1 个答案: