DesignerAshish
DesignerAshish

Reputation: 81

Disable Browser Search and using my own search input on CTRL F

I am trying to disable the browser search functionlity and at the same time i want to focus my own custom search box in website.

here is code for the same.

 document.addEventListener("keydown", function(e) {
      if (e.keyCode == 70 && e.ctrlKey || e.keyCode === 114) {
              document.getElementById("myInput").focus();
            }
        e.preventDefault();
    })

it disable the browser search feature and focus my custom search bar but it does not allow me to type anything in my custom search input.

Upvotes: 0

Views: 871

Answers (2)

Mayur Narkhede
Mayur Narkhede

Reputation: 43

keycode is now deprecated. Use this:

window.addEventListener("keydown", function(e) {
  if ( (e.code == "0x0021" && e.key == "Control") || e.code == "0x003D") {
    document.getElementById("myInput").focus();
    e.preventDefault();
  }
})
<input id="myInput" />

Upvotes: 0

Dekel
Dekel

Reputation: 62556

The preventDefault() should be used only if the relevant key is the ctrl+f:

document.addEventListener("keydown", function(e) {
  if (e.keyCode == 70 && e.ctrlKey || e.keyCode === 114) {
    document.getElementById("myInput").focus();
    e.preventDefault();
  }
})
<input id="myInput" />

Otherwise you prevent any keydown that use is doing...

Upvotes: 2

Related Questions