当前位置: 首页 > news >正文

input 框如何移动光标,设置光标位置?

获取 input 光标位置

const inputDom = document.getElementById("input")
const selectionStart = inputDom.selectionStart

设置 input 光标

inputDom.focus()
// focus() 异步,所以加了 setTimeout
setTimeout(() => {const nextSelection = selectionStart + 1inputDom.setSelectionRange(nextSelection, nextSelection)
}, 0)
element.setSelectionRange(selectionStart, selectionEnd [, selectionDirection]);
  • selectionStart: 被选中的第一个字符的位置索引, 从 0 开始。如果这个值比元素的 value 长度还大,则会被看作
    value 最后一个位置的索引。

  • selectionEnd: 被选中的最后一个字符的下一个位置索引。如果这个值比元素的 value 长度还大,则会被看作 value 最后一个位置的索引。

  • selectionDirection:选择方向。forward/backward/none 如果 selectionStart 与
    selectionEnd 相同,不选中任何,光标聚集在 selectionStart/selectionEnd。

     如果 selectionEnd 小于 selectionStart,不选中任何,光标聚集在在 selectionEnd。
    

inputDom.setSelectionRange(0, 4)表现如下图:

在这里插入图片描述

相关文章:

input 框如何移动光标,设置光标位置?

获取 input 光标位置 const inputDom document.getElementById("input") const selectionStart inputDom.selectionStart设置 input 光标 inputDom.focus() // focus() 异步,所以加了 setTimeout setTimeout(() > {const nextSelection selection…...

linux内核系统调用学习5:SYSCALL_DEFINE<0-6>

系统调用最大参数是6,由下面这个宏定义,位于文件include\linux\syscalls.h #define SYSCALL_DEFINE_MAXARGS 6 SYSCALL_DEFINE0(fork) fork:系统调用名。 SYSCALL_DEFINE1(set_tid_address, int __user *, tidptr) set_tid_address&#x…...

maven镜像仓库配置(多镜像自动切换)

大家在使用IDEA的时候会遇到这样的一个问题&#xff0c;就是在下载源代码和资源文档的时候&#xff0c;有些镜像仓库里面没有源代码和资源文档&#xff0c;然后会导致下载失败。 这时候就需要多个镜像仓库的地址了。 附上我自己的配置文件&#xff1a; <mirrors><!--…...

ChatGPT在智能监控和安防系统中的应用如何?

ChatGPT在智能监控和安防系统中有着广泛的应用潜力。智能监控和安防系统是利用人工智能和计算机视觉技术来实现对环境的实时监控和安全保障的系统。ChatGPT作为一种通用的预训练语言模型&#xff0c;可以在智能监控和安防系统中发挥以下作用&#xff1a; 1. **智能视频监控**&…...

【Spring Boot Admin】介绍以及使用

介绍 概述 Spring Boot Admin是一个监控工具&#xff0c;旨在以一种漂亮且易于访问的方式可视化Spring Boot Actuators提供的信息。 主要功能点 显示应用程序的监控状态应用程序上下线监控查看 JVM&#xff0c;线程信息可视化的查看日志以及下载日志文件动态切换日志级别Http…...

本地私有仓库部署、docker--harbor私有仓库部署和管理

部署本地私有仓库 拉取镜像 修改daemon.json配置文件 重启docker服务 创建容器 为镜像打标签 上传镜像 查看私有仓库 其他主机拉取私有仓库镜像 Docker--harbor私有仓库 &#xff08;1&#xff09;什么是Harbor Harbor 是 VMware 公司开源的企业级 Docker Registry 项目…...

java根据模板导出word

java根据模板导出word 日常开发中&#xff0c;常常会遇到各种各样的表格进行导出&#xff0c;比较好的办法就是提前弄好word模版&#xff0c;再通过遍历的方式进行导出文档 1、制作word模版 模版编写 内容替换 目标下面模版进行多页展示 将word转换成xml 将xml格式化 再将x…...

spring学习笔记十四

注解开发Bean总结 功能 xml配置注解定义Bean bean标签 id属性class属性 Component ControllerServiceRepositorComponentScan 设置依赖注入 setter注入(set方法) 引用类型/简单类型构造器注入 引用类型和简单类型自动装配 Autowired QualifierValue 配置第三方Bean be…...

【springmvc部分功能源码仿写第一步】实现java对目录下所有文件的遍历

废话不多说&#xff0c;直接上源码&#xff01; public class MiniSpring {public static void main(String[] args) {String path "D:\\ideaProject\\thread";File file new File(path);List<String> list new ArrayList<>();System.out.println(fi…...

SpringBoot中接口幂等性实现方案-自定义注解+Redis+拦截器实现防止订单重复提交

场景 SpringBootRedis自定义注解实现接口防刷(限制不同接口单位时间内最大请求次数)&#xff1a; SpringBootRedis自定义注解实现接口防刷(限制不同接口单位时间内最大请求次数)_redis防刷_霸道流氓气质的博客-CSDN博客 以下接口幂等性的实现方式与上面博客类似&#xff0c;…...

论文解读|用于从RGB-D数据进行3D物体检测的Frustum PointNets

原创 | 文 BFT机器人 01 摘要 论文研究了室内和室外场景中基于RGBD数据的3D目标检测。论文的方法不仅仅依赖于3D方案&#xff0c;而是利用成熟的2D对象检测器和先进的3D深度学习进行对象定位&#xff0c;即使是小对象也能实现高效率和高召回。 直接在原始点云中学习&#xff0…...

3ds Max图文教程: 使用动态工具Mass FX 创建风铃动画

推荐&#xff1a; NSDT场景编辑器助你快速搭建可二次开发的3D应用场景 1. 简单的场景设置 步骤 1 打开 3ds Max。 打开 3ds Max 步骤 2 我将向您展示风铃背后的动态 通过简单的场景设置进行模拟。一旦你有了这个想法&#xff0c;你就可以应用这个 技术到复杂的风铃结构。 基…...

抖音矩阵系统源码开发搭建部署分享

一、 功能开发设计 &#xff08;1&#xff09;数据概览&#xff1a;账号&#xff0c;视频top10数据统计 &#xff08;2&#xff09;AI视频创意&#xff1a;原创视频批量剪辑&#xff0c;阶乘算法&#xff0c;去重原理 &#xff08;3&#xff09;同城拓客&#xff1a;线下门店…...

Grafana图形web监控的安装与配置

目录 一、安装并配置 二、Web访问 三、Grafana启用zabbix插件 四、Grafana添加zabbix数据源 五、创建仪表盘 创建监控项完成保存仪表盘 六、查看创建的仪表盘 七、在现有的dashboard&#xff08;仪表盘&#xff09;中添加图形 八、查看最终dashborad&#xff08;仪表盘&#x…...

【机器学习】了解 AUC - ROC 曲线

一、说明 在机器学习中&#xff0c;性能测量是一项基本任务。因此&#xff0c;当涉及到分类问题时&#xff0c;我们可以依靠AUC - ROC曲线。当我们需要检查或可视化多类分类问题的性能时&#xff0c;我们使用AUC&#xff08;曲线下面积&#xff09;ROC&#xff08;接收器工作特…...

Docker 容器生命周期:创建、启动、暂停与停止----从创建到停止多角度分析

&#x1f337;&#x1f341; 博主 libin9iOak带您 Go to New World.✨&#x1f341; &#x1f984; 个人主页——libin9iOak的博客&#x1f390; &#x1f433; 《面试题大全》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33…...

C++STL库中的vector

文章目录 vector的介绍及使用 vector深度剖析及模拟实现 动态二维数组理解 一、vector的介绍及使用 1.vector的介绍 1. vector是表示可变大小数组的序列容器。 2. 就像数组一样&#xff0c;vector也采用的连续存储空间来存储元素。也就是意味着可以采用下标对vector的元素进…...

PHP 药店管理系统mysql数据库web结构apache计算机软件工程网页wamp

一、源码特点 PHP 药品管理系统 是一套完善的web设计系统,系统采用smarty框架进行开发设计&#xff0c;对理解php编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。 PHP 药店管理系统mysql数据库web结构apache计 下载地址…...

【多选框、表格全选】element el-checkbox、el-table

话不多说 先看效果&#xff1a; 多选框&#xff1a; 表格全选&#xff1a; <template><div><div class"titleLabel"><div class"lineStyle"></div>统计部门</div><div style"display: flex"><e…...

【Java】微服务负载均衡算法实现

前言 本篇实现一下分布式中负载均衡的实现策略&#xff0c;以及负载均衡算法是如何实现的。 什么是负载均衡&#xff1f; Java负载均衡是指在多台服务器之间分配负载&#xff0c;以提高服务器的性能和可用性。它通过将请求分发到多台服务器来减少单个服务器的压力&#xff0…...

如何用Python 5分钟获取同花顺问财数据?量化分析终极指南

如何用Python 5分钟获取同花顺问财数据&#xff1f;量化分析终极指南 【免费下载链接】pywencai 获取同花顺问财数据 项目地址: https://gitcode.com/gh_mirrors/py/pywencai 还在为获取金融数据而烦恼吗&#xff1f;想快速筛选股票却苦于没有合适工具&#xff1f;今天我…...

AI编程技能自学习:构建Claude与Cursor的智能协同开发环境

1. 项目概述&#xff1a;当Claude遇上Cursor&#xff0c;一场关于AI编程技能的自我进化最近在GitHub上看到一个挺有意思的项目&#xff0c;叫Self-Learning-Claude-Skill。虽然项目描述和正文都还是空的&#xff0c;但光看这个标题和关键词——claude-code、cursor、skills——…...

【Prometheus】如何使用 `promtool` 工具来检查目标端点的指标是否符合规范?

使用 promtool 进行指标合规性验证:从开发到上线的标准化质量门禁 用户问题原文:“如何使用 promtool 工具来检查目标端点的指标是否符合规范?” 在超大规模生产环境中,Prometheus 监控着成千上万个由不同团队、使用不同语言(Java/Spring, Go, Python)开发的服务。一个不…...

兔子需要通风吗?关键不是风,而是空气路径

养兔子的朋友&#xff0c;大概率都有一个共识&#xff1a;要给兔子控温&#xff0c;夏天防中暑、冬天防受冻。但很多人都忽略了一个和温度同等重要的点——空气流动。 从环境工程的角度来说&#xff0c;兔子的舒适生活环境&#xff0c;离不开三个核心因素&#xff1a;温度、湿度…...

数字示波器原理与高频信号测量实战指南

1. 数字示波器基础&#xff1a;从原理到实战的完整指南作为电子工程师的"眼睛"&#xff0c;示波器在电路调试、信号分析和故障诊断中扮演着不可替代的角色。记得我第一次使用数字示波器测量高速串行信号时&#xff0c;面对屏幕上扭曲的波形完全不知所措——后来才发现…...

OnmyojiAutoScript:阴阳师全自动脚本终极指南,30+日常任务智能托管解放双手

OnmyojiAutoScript&#xff1a;阴阳师全自动脚本终极指南&#xff0c;30日常任务智能托管解放双手 【免费下载链接】OnmyojiAutoScript Onmyoji Auto Script | 阴阳师脚本 项目地址: https://gitcode.com/gh_mirrors/on/OnmyojiAutoScript 阴阳师作为一款深受玩家喜爱的…...

观察taotoken用量看板如何帮助个人开发者精细化控制api成本

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 观察taotoken用量看板如何帮助个人开发者精细化控制api成本 对于个人开发者或小型团队而言&#xff0c;在使用大模型API进行项目开…...

Windows系统清理终极指南:DriverStore Explorer深度使用教程

Windows系统清理终极指南&#xff1a;DriverStore Explorer深度使用教程 【免费下载链接】DriverStoreExplorer Driver Store Explorer 项目地址: https://gitcode.com/gh_mirrors/dr/DriverStoreExplorer 你的C盘是不是总在不知不觉中变小&#xff1f;系统运行越来越慢…...

观察Taotoken在多模型并发请求下的稳定性与响应表现

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 观察Taotoken在多模型并发请求下的稳定性与响应表现 在实际业务开发中&#xff0c;我们常常需要同时调用多个不同的大模型来处理不…...

热成像与计算机视觉融合:打造免提可穿戴交互新范式

1. 项目概述&#xff1a;从一次“意外”到可穿戴交互新范式 在实验室里摆弄新到的热成像相机&#xff0c;这原本只是一个打发时间的“快乐意外”。我的咖啡杯、显示器&#xff0c;甚至是我自己的脸&#xff0c;在热成像镜头下都呈现出有趣的温度图案。但真正让我停下手中咖啡的…...