在JavaScript中，设置焦点元素到input的方法有很多，这里我们主要介绍两种方法：1. 使用focus()方法；2. 使用setFocus()方法，这两种方法都可以实现将焦点设置到指定的input元素上。
使用focus()方法
focus()方法是HTMLInputElement接口的一个属性，用于将焦点设置到指定的input元素上，使用方法如下：
document.getElementById("inputId").focus();
inputId是需要设置焦点的input元素的ID。
示例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>使用focus()方法设置焦点</title>
<script>
function setFocus() {
document.getElementById("myInput").focus();
}
</script>
</head>
<body>
<input type="text" id="myInput">
<button onclick="setFocus()">设置焦点</button>
</body>
</html>
使用setFocus()方法(自定义函数)
如果你想要自定义一个设置焦点的方法，可以创建一个名为setFocus的函数，如下所示：
function setFocus(elementId) { var element = document.getElementById(elementId); if (element) { element.focus(); } else { console.error("未找到指定ID的元素"); } }
在这个函数中，我们接收一个参数elementId,表示需要设置焦点的input元素的ID，然后通过document.getElementById()方法获取该元素，并调用其focus()方法将焦点设置到该元素上，如果没有找到指定ID的元素，我们在控制台输出错误信息。
示例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>使用自定义setFocus()方法设置焦点</title>
<script>
function setFocus(elementId) {
var element = document.getElementById(elementId);
if (element) {
element.focus();
} else {
console.error("未找到指定ID的元素");
}
}
</script>
</head>
<body>
<input type="text" id="myInput1">
<input type="text" id="myInput2">
<button onclick="setFocus('myInput1')">设置焦点到myInput1</button>
<button onclick="setFocus('myInput2')">设置焦点到myInput2</button>
</body>
</html>
相关问题与解答：
1、如何判断一个input元素是否已经获得焦点？可以使用document.activeElement属性来获取当前获得焦点的元素，然后判断该元素是否为指定的input元素，示例代码如下：
function isInputFocused(elementId) {
var focusedElement = document.activeElement;
return focusedElement && focusedElement.id === elementId;
}
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/196824.html
微信扫一扫 