chrome通过console控制台在两个input输入框中进行切换
时间: 2024-03-19 19:43:49 浏览: 104
console.img::party_popper:在Chrome浏览器控制台中显示图片
你可以使用 `document.querySelector` 或 `document.getElementById` 方法获取到需要进行操作的两个 `input` 元素,然后使用 `element.focus()` 方法将焦点设置在其中一个 `input` 上,再次调用该方法将焦点切换到另一个 `input` 上。以下是一个简单的示例代码:
```javascript
// 获取两个输入框元素
const input1 = document.querySelector('#input1');
const input2 = document.querySelector('#input2');
// 焦点切换函数
function toggleFocus() {
if (document.activeElement === input1) {
input2.focus();
} else {
input1.focus();
}
}
// 绑定键盘事件
document.addEventListener('keydown', event => {
if (event.key === 'Tab') {
event.preventDefault(); // 阻止默认行为
toggleFocus();
}
});
```
在该示例中,我们先获取了两个 `input` 元素,然后定义了一个 `toggleFocus` 函数,用于将焦点切换到另一个 `input` 上。最后,我们在文档对象上绑定了一个 `keydown` 事件,当用户按下 `Tab` 键时,阻止默认行为并调用 `toggleFocus` 函数实现焦点切换。
阅读全文