lets say i have this html file
<!DOCTYPE html>
<html>
<head>
<script type="application/javascript" src="./jsfile.js" defer></script>
</head>
<body>
<p>some text</p>
<input type="text">
<body>
</html>
and this javascript file called jsfile.js
let p=document.getElementsByTagName("p");
let input=document.getElementsByTagName("input");
p.onpointerdown=()=>{
input[0].focus();
};
what i am trying to do here is when the pointerdown event is called on the <p> element, the input element get focused.
i tried with mouseclick event and it worked but i cant get it to work on the pointerdown event.
There are several issues here:
Rather you should use something like this:
// This will give you a single element
const p = document.querySelector("p");
// Same thing here
let input=document.querySelector("input");
p.onpointerdown = (e) => {
// This part is necessary here to avoid default begaviour
// Mose browsers would fire mousedown event if this event is not canceled, therefore it will affect your focus
e.preventDefault();
input.focus();
};