Question

我有多行容器，但只有第一行可见（overflow:hidden）。容器可以在点击时展开。（参见https://stackoverflow.com/a/6972830和jsFiddle http://jsfiddle.net/JUtcX/2/）

如果有人使用不可见线条中的文字执行Ctrl + F，浏览器会报告匹配但无法显示（因为它已隐藏）。

如何对Ctrl + F作出反应并打开容器是否搜索了其中的不可见文本？

[更新] 不符合所有要求的方法：

聆听Ctrl + F.
- 我有多个容器，只想扩展包含搜索短语的容器。听完Ctrl + F后，我只能一次打开所有容器。
- 不适用于所有系统。但这只是一个可以忽略不计的缺陷。
特定于Chrome的解决方法（link）
- 至少还应支持Firefox

Answer 1

您可以这样做：

function find(e) {
    if (e.ctrlKey && e.keyCode == 70) {
        document.getElementById("hide").style.display = "block";
    }
}
document.addEventListener('keyup', find, false);

#hide{
  display: none;
}

<div>
  ASDF:
  <div id="hide">
    Hidden
  </div>
</div>

Listening to browser Ctrl+F/find layout modifications

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

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

在示例中，父样式为overflow：hidden;。因此确实如此   不会触发任何滚动事件。

因此，无法听取这些布局变化   监听滚动事件的唯一解决方法   overflow：hiden元素，就是听鼠标滚轮事件...

糟糕的故事是，不可能阻止用户   通过浏览器修改布局查找，因为即使可以   阻止Ctrl + F或F3，我们无法阻止用户使用Edit-＆gt;找   Firefox或IE中的菜单

JBE

Listen for Events from Browser "Find" Window in JavaScript

我不知道你有什么方法可以听取类似发现的事件   任何浏览器都支持它，它肯定不是一个便携式解决方案。

我也不知道你想要实现什么，但我认为你的   最好的选择是监听触发查找的键盘事件   窗口并尝试在尝试模拟时取消它们   使用您自己的JavaScript查找工具栏/窗口。然而，这是一个   由于某些浏览器导致的任务（并且几乎不可能）   键盘快捷键的自定义取决于本地化（for   例如，在IE中，en-US使用Ctrl + F（用于查找），而pt-PT使用Ctrl + L.   （对于Localizar，意思是找））。

结论：我认为你在那里运气不好......

Miguel Ventura

隐藏文本中的Ctrl + F：显示文本

1 个答案: