2

在当前的最小示例（http://jsfiddle.net/twPHW/）中：

<div style="overflow: hidden; height: 24px;">

<table>
<thead>
<tr>
<td style="background-color: rgb(109,173,157);">foo</td>
</tr>
</thead>
<tbody>
<tr>
<td style="background-color: rgb(236,222,117);">bar</td>
</tr>
</tbody></table>

</div>

“foo”单元格是唯一可见的单元格。然后，如果我按 Ctrl-F（在浏览器中查找功能）并开始输入“bar”，则 div 内的表格会上升（就像它的顶部发生变化一样）以向用户显示匹配的元素。

我希望能够通过查找功能查找“栏”，但我想通过 javascript 处理该布局修改。

我知道不可能监听浏览器 "find"。我只是想听听这个布局修改，以防止它或相应地同步我的视图的其余部分。我尝试收听滚动事件或使用 Chrome Mutation Observer但它不起作用。任何想法 ？

4

2 回答 2

1

我认为不可能听那些布局修改。

当浏览器找到一个元素时，就相当于调用scrollIntoView了匹配的元素。因此，仅当容器 div 可滚动时才会触发滚动事件。

在示例中，父样式为overflow: hidden;. 因此它不会触发任何滚动事件。

然后就不可能监听这些布局更改，因为在溢出：隐藏元素上监听滚动事件的唯一解决方法是监听鼠标滚轮事件......

糟糕的是，无法阻止用户通过浏览器查找修改布局，因为即使可以阻止 Ctrl+F 或 F3，我们也无法阻止用户Edit-> Find在 Firefox 或 IE 中使用菜单

于 2013-11-13T15:48:55.000 回答
0

我没有对此进行测试，但一种选择是preventDefault()在 ctrl+f 按键上，然后制作您自己的查找功能版本。

于 2013-11-12T18:51:06.943 回答