0

我知道还有一些与此相关的其他问题（包括我不久前提出的一个问题），但我正在寻找一种方法来改进我发现的唯一可行的解​​决方案。

我正在努力做到这一点，以便我可以使用鼠标滚轮滚动高度受限的 和，并且当包含在其内容来自 AJAX 调用的aoverflow: scroll; <div>中时，该滚轮将继续工作。<div><div>

在我的网络旅行中，我偶然发现了这个小提琴：http: //jsfiddle.net/mrtsherman/eXQf3/33/。不幸的是，当从 AJAX 调用中调用数据时，我无法让它工作 - 我不知道为什么会这样，所以如果有人知道这个问题，我会很感激一些建议！

不过，我有点跑题了，因为我的问题与我发现至少有效的唯一解决方案有关：onmouseover 类添加。

分区

<div onmouseover="$('html').addClass('noscroll');" 
     onmouseout="$('html').removeClass('noscroll');" 
     style="overflow:auto;max-height: 200px;">Data that is long</div>

CSS 类

html.noscroll
{
    position: fixed; 
    overflow-y: scroll;
    width: 100%;
}

我一直在使用这段代码，认为它可以完美运行，但是我刚刚发现在较小的显示器上它会引发一个更烦人的问题：跳回屏幕顶部！

似乎当它position: fixed;被触发时，它确实禁用了滚动条并使其保持可见（我想要），但它也将滚动条再次移动到顶部，并且由于我的可滚动 div 位于页面的一半，所以它不可能使用。

4

1 回答 1

1

对于这部分：

不幸的是，当从 AJAX 调用中调用数据时，我无法让它工作 - 我不知道为什么会这样，所以如果有人知道这个问题，我会很感激一些建议！

您需要更改少量代码：

$('#abs').on('mousewheel', function(e) {

更改后

bind仅适用于现有元素，不能附加到通过 ajax 获取的元素。来自 jQuery 网站：

从 jQuery 1.7 开始，.on() 方法是将事件处理程序附加到文档的首选方法。对于早期版本，.bind() 方法用于将事件处理程序直接附加到元素。处理程序附加到 jQuery 对象中当前选定的元素，因此这些元素必须存在于调用 .bind() 的位置。有关更灵活的事件绑定，请参阅 .on() 或 .delegate() 中有关事件委托的讨论。

阅读更多关于 .on() 方法

因此，请尝试将您的代码更改为我向您展示的代码，并在更改后给我反馈。

于 2013-05-21T18:44:55.100 回答