html textarea 在输入框光标移动时执行1个js方法,如何实现?
时间: 2023-07-16 18:16:25 浏览: 174
可以使用 `onfocus` 和 `onblur` 事件来实现。
`onfocus` 事件在文本框获得焦点时触发,`onblur` 事件在文本框失去焦点时触发。通过这两个事件,可以实现在光标移动时执行某个方法。
例如:
```html
<textarea id="myTextarea" onfocus="myFunction()" onblur="myFunction()">这里是文本框</textarea>
<script>
function myFunction() {
// 这里执行你想要的操作
console.log("光标移动了");
}
</script>
```
当光标移入或移出文本框时,都会执行 `myFunction()` 方法。你可以根据实际情况选择只在光标移入或移出时执行该方法。
相关问题
textarea输入框输删除内容光标跳到最后
当你在textarea(文本区域)输入框内删除内容时,如果希望光标自动跳到删除内容后的最后位置,可以在用户触发`input`事件或`keydown`事件后,检查当前光标的位置以及删除的内容长度,然后更新光标的坐标。
JavaScript示例代码:
```javascript
function handleInput(e) {
const textArea = e.target;
const start = textArea.selectionStart; // 获取开始位置
const end = textArea.selectionEnd; // 获取结束位置
const deletedLength = end - start; // 计算删除的字符数
// 更新光标位置
if (deletedLength > 0) {
textArea.setSelectionRange(start + deletedLength, start + deletedLength);
}
}
// 绑定事件监听
const textAreaElement = document.querySelector('textarea');
textAreaElement.addEventListener('input', handleInput);
textAreaElement.addEventListener('keydown', handleInput);
```
这段代码会在textarea内容发生变化时检测并调整光标位置。当有内容被删除时,光标会移动到删除内容之后的末尾。
阅读全文