Is it possible to know what my users are searching for on my web pages by Ctrl+F in JavaScript? So when a user uses Ctrl+F to search for something, JavaScript can capture this action (and the search phrase) and send it back to the server.

Possible? How?

Is it possible to know what my users are searching for on my web pages by Ctrl+F in JavaScript? So when a user uses Ctrl+F to search for something, JavaScript can capture this action (and the search phrase) and send it back to the server.

Possible? How?

• javascript
• browser
• analytics

Share Improve this question Follow edited Jan 31, 2019 at 8:06 Fabrizio 8,06366 gold badges5757 silver badges115115 bronze badges asked Jan 7, 2013 at 0:13 datasn.iodatasn.io 12.9k2828 gold badges122122 silver badges158158 bronze badges 4

• Yes, it is possible. What specifically are you having trouble with? – Will C. Commented Jan 7, 2013 at 0:19
• I don't know how. I searched in Google it's all triggering Ctrl + F key rather than to track it. – datasn.io Commented Jan 7, 2013 at 0:20
• 1 found via google: stackoverflow./questions/93695/… (replace S keycode with F). This can track the keystroke - tracking what they type in the search box is out of javascripts ability. – jbabey Commented Jan 7, 2013 at 0:21
• Sorry, I can only go so far as getting the ctrl+f key strokes. Retrieving the text they are searching for in the browser is not possible. – Will C. Commented Jan 7, 2013 at 0:39

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 1

Nope, not possible. On some browsers you can catch the key bination Ctrl+F, but you can't spy on what the user searched for. On other browsers you can't catch Ctrl+F at all.

If it's any consolation, there's probably a security flaw you can use on IE6.

I've just found a workaround that might help in some cases.

Notice, that document and scrollable elements are always scrolling to the next searched occurrence - we can take advantage of that and create an "hidden" scrollable element and wait for it to scroll. When it scrolls you can then read the position to which it scrolled and get matched word.

http://jsfiddle/oz6gum90/6/

HTML:

<div id="hiddenScrollableContent">
    <div></div> <!-- first element must be empty -->
    <div>car</div>
    <div>cat</div>
    ...
</div>

CSS:

#hiddenScrollableContent{
    overflow: scroll;
    position:absolute;
    height:20px;  /* can't be zero ! */
    opacity:0.01; /* can't be zero ! */
    pointer-events: none;
}
#hiddenScrollableContent div{
    height: 100px;
}

JS:

$('#hiddenScrollableContent').scroll(function(e){
    var top = $(this).scrollTop();

    if (top==0)
        return; //prevents endless loop

    var index = Math.round(top / 100);
    var element = $('div', this).eq(index);
    var elementsText = element.text();
    $(this).scrollTop(0);

    console.log('top:'+top, 'index:'+index);

    $('span').text(elementsText);
});

No. You can't and by all security reasons should never have access to browser's UI elements outside page. You can capture Ctrl+F and handle it on your own though. But, of course, it will look different than browser's own UI element.