javascript - How to prevent a click from passing through a fixed positioned element to the element behind it? -

i have fixed positioned header has searchbox in , there content behind (the header has higher z-index). have event handler handles 'focus' event on searchbox. problem when click in searchbox, event handler triggers, click passes through header elements behind it. don't want click pass through. tried event.preventdefault(), event.stoppropagating() , event.cancelbubble = true none of them seems work.

it looks you're trying stop propagation of focus event.

try binding click event of searchbox , use event.stoppropagation() on it.