3

我有一个问题，我的盒子有点像实时提要并不断更新。此实时提要具有溢出-y：滚动，我使用 scrollTop 将它们带到容器的底部。

但是，如果单击选择框，它将在实时提要更新并调用 scrollTop 时自动关闭。

这似乎只在 Chrome（版本 27.0.1453.110 m）中被破坏它在 IE、FF、Opera、Safari 中正常工作。

可以在这里查看示例，点击选择框等待其他框开始滚动，选择框会丢失下拉菜单：http: //jsfiddle.net/xa3D2/2/

HTML

<select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>
<div id="scrollBox">
</div>

JS

function addContent()
{
    $('#scrollBox').append('<div>');
    $('#scrollBox').scrollTop($('#scrollBox').prop('scrollHeight'));
    setTimeout(addContent,500);
}
setTimeout(addContent,500);

CSS

#scrollBox {
    border: 1px solid #ccc;
    overflow-y: scroll;
    word-wrap: break-word;
    background: #fff;
    color: #000;
    text-align: left;
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    width: 100px;
    height: 300px;
}
#scrollBox div {
    height: 50px;
    border: 1px solid #00f;
}

我想我的问题是这是一个 Chrome 错误吗？有没有办法解决这个问题？

4

2 回答 2

2

这已在最新的 Chrome 中得到修复。您可以通过访问https://www.google.com/intl/en/chrome/browser/canary.html看到这一点

我们显然正在等待更新。

我下载了最新的 Canary 版本，并且可以确认它不会在那里发生。

于 2013-06-17T18:25:43.983 回答
0

该问题似乎仅在选择位于滚动区域上方时发生。作为修复，我会：

  • 使用 jQuery .menu() 小部件获取可选选项列表http://jqueryui.com/menu/；或者
  • 重做布局，使选择不在由 scrollTop() 重新绘制的区域上。
于 2013-06-17T17:52:11.653 回答