有没有办法检测在 javascript 中的页面搜索中的查找答案

【问题标题】：Is there a way to detect find on the page searches in javascript有没有办法检测在 javascript 中的页面搜索中的查找
【发布时间】：2014-09-13 17:42:42
【问题描述】：

每个浏览器都有在页面上查找功能 (ctrl+F)。有没有办法检测 javascript 中的用户搜索，以便我可以附加其他操作。

【问题讨论】：

有趣的问题；我从来没有听说过这样做，我想我从来没有见过它在行动，但我现在很好奇。
你能听到 ctrl+F 按键事件吗？（或 command+F 等）还是因为搜索对话框而没有冒泡？
嗯 ^F 不是启动搜索的唯一方法 - 在 Firefox 中它是“/”（至少，它适合我）。
Netflix 可以使用一些检测，当所有电影的标题都嵌入图像并且没有任何可搜索的文本时，无法在页面上搜索某些内容

标签： javascript events find

【解决方案1】：

你可以这样做（检测用户何时按下 ctrl+f）：

window.onkeydown = function(e){
   if(e.keyCode == 70 && e.ctrlKey){
    //user pressed ctrl+f
}

在这里提琴：http://jsfiddle.net/d8T72/

【讨论】：

【解决方案2】：

当然，您可以尝试挂钩到 ctrl+f 或 cmd+f 快捷方式，但即使这适用于“某些”浏览器，这样您也只会知道用户按下了该快捷方式并且最有可能搜索某些内容。

如果浏览器允许覆盖该快捷方式，您可以进一步阻止默认行为并在网站上实现您自己的搜索逻辑。但这在大多数情况下被认为是非常糟糕的做法。覆盖本机浏览器行为非常糟糕。

另一方面，浏览器执行搜索过程时不会触发“事件”。简而言之，不，实际上没有办法使用 javascript 检测或挂钩搜索过程（如果有，它永远不会跨浏览器兼容）。

【讨论】：

因为我对搜索过程感兴趣，而不仅仅是 contl+F，所以我将不得不忍受这个。谢谢

【解决方案3】：

这是一个解决替代页面查找情况的解决方案（例如，Command+F，Firefox 上的“/”）。它检查这些按键中的任何一个，并在它们发生时设置一个计时器。如果窗口很快模糊，则假定正在显示“查找”对话框。

缺点：不考虑通过菜单启动的“查找”对话框。我看不出有什么方法可以确定这部分，因为（至少据我所知）浏览器 UI 禁止在 DOM 内运行 Javascript。

var keydown = null;

$(window).keydown(function(e) {
    if ( ( e.keyCode == 70 && ( e.ctrlKey || e.metaKey ) ) ||
         ( e.keyCode == 191 ) ) {
        keydown = new Date().getTime();
    }

    return true;
}).blur(function() {
    if ( keydown !== null ) {
        var delta = new Date().getTime() - keydown;
        if ( delta >= 0 && delta < 1000 )
            console.log('finding');

        keydown = null;
    }
});

jsFiddle，在 Chrome、Safari 和 Firefox 中测试

【讨论】：

【解决方案4】：

正如@Nicola Peluchetti 最初建议的那样，这里是通过特征嗅探稍微改进的版本：

window.onkeydown = function(e){
    var ck = e.keyCode ? e.keyCode : e.which;
    if(e.ctrlKey && ck == 70){
        alert('Searching...');
    }
}

Browser search test case »

【讨论】：