Layui弹框中设置输入框自动获取焦点无效/Layui设置Input框自动获取焦点无效,怎么办?

news2024/11/23 16:37:36

1、问题概述?

有时候为了用户体验,期望当弹框打开的时候,指定的输入框能自动的获取焦点,用户就可以直接输入了。提升了用户体验。但有时候设置的时候没有效果。

2、正常的设置自动获取焦点方式

【input框设置方式】

使用关键字autofocus

<input type="text"  required lay-verify="required"  id="test"  placeholder="请输入内容" autocomplete="off" class="layui-input" autofocus>

【弹框设置】

在弹框的最后,需要刷新form表单

//刷新form表单的input组件
form.render("input");
//刷新form表单--刷新全部
form.render();

3、如果没有效果,你不妨换个思路

Layui的本质还是JavaScript,我们完全可以使用JS代码或者jQuery实现让输入框自动获取焦点焦点。

【通过JavaScript设置输入框获取焦点】

需要注意的是,设置之后,依旧需要刷新form表单。

//设置焦点自动获取
document.getElementById('test').focus();
//刷新form表单--刷新

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1807440.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Linux - 逻辑卷的创建和管理

1.逻辑卷LVM的创建 1.1 创建步骤 ①添加硬盘或者创建分区 ②创建物理卷 pvcreate ③创建卷组 vgcreate ④创建逻辑卷 lvcreate ⑤创建文件系统 mkfs.xfs/ect4/... ⑥创建挂…

安装搭建java版的悟空crm遇到 网络错误请稍候再试 终极解决办法(hrm人力资源模块)

java版 项目目录 ├── build – webpack 配置文件 ├── config – 项目配置文件 ├── src – 源码目录 │ ├── api – axios请求接口 │ ├── assets – 静态图片资源文件 │ ├── components – 通用组件 │ ├── directives – 通用指令 │ ├── filters –…

状态方程ABCD矩阵如何确定例子

状态方程ABCD矩阵如何确定 确定状态空间表示中的状态矩阵A、输入矩阵 B、输出矩阵C 和直通矩阵D,需要从系统的动力学方程出发,并将其转换为状态方程的形式。我们可以通过一个具体的物理系统(如倒立摆系统)来说明这一过程 例子:倒立摆系统 系统描述 考虑一个倒立摆系统…

串口RS232 RS485

RS232 RS232是在1970年由美国电子工业协会(EIA)联合贝尔系统、调制解调器厂家及计算机终端生产厂家共同制定的用于串行通讯的标准。它的全名是“数据终端设备(DTE)和数据通讯设备(DCE)之间串行二进制数据交换接口技术标准”。 该标准规定采用一个25个脚的DB-25连接器&#xff…

Cocos2dx 编译游戏安装包制作教程

在本教程中&#xff0c;我们将学习如何为 Visual Studio 编译项目配置图标&#xff0c;并使用 Inno Setup 创建安装包。我们将包括以下部分&#xff1a; 设置项目图标&#xff1a;在 Visual Studio 中配置 .exe 文件的图标&#xff0c;或者使用第三方工具替换编译后的图标。创…

王学岗鸿蒙开发(北向)——————(七、八)ArkUi的各种装饰器

arts包含如下&#xff1a;1&#xff0c;装饰器 &#xff1b;2&#xff0c;组件的描述(build函数)&#xff1b;3&#xff0c;自定义组件(Component修饰的),是可复用的单元&#xff1b;4&#xff0c;系统的组件(鸿蒙官方提供)&#xff1b;等 装饰器的作用:装饰类、变量、方法、结…

汇编语言LDS指令

在8086架构的实模式下&#xff0c;LDS指令&#xff08;Load Pointer Using DS&#xff09;用于从内存中加载一个32位的指针到指定寄存器和DS寄存器。我们来详细解释一下这条指令为什么会修改DS段寄存器。 LDS指令的功能 LDS指令格式如下&#xff1a; LDS destination, sourc…

SNAT与DNAT

一、SNAT策略概述 1、SNAT 策略的典型应用环境 局域网主机共享单个公网IP地址接入Internet&#xff08;私有IP不能在Internet中正常路由&#xff09; 局域共享上网 2、 SNAT 策略的原理 修改数据包的源地址 把从内网 --> 外网的数据的源内网地址转换成公网源地址 3、SN…

多目标检测模型加权框集成

优秀项目推荐&#xff1a;https://gitcode.com/ZFTurbo/Weighted-Boxes-Fusion/overview 参考链接&#xff1a; 目标检测加权框融合 WBF原理讲解 https://blog.csdn.net/YXD0514/article/details/132574588 目标检测加权框融合 WBF原理讲解&#xff08;Weighted Boxes Fusion&…

java中集合List,Set,Queue,Map

Java SE中的集合框架是一组用于存储和操作对象的类和接口。它提供了丰富的数据结构&#xff0c;可以用于解决各种问题。Java SE中的集合框架包含以下主要类和接口&#xff1a; 一. Collection接口&#xff1a; 是集合框架的根接口&#xff0c;它定义了一些通用的集合操作方法…

微服务之远程调用

常见的远程调用方式 RPC&#xff1a;Remote Produce Call远程过程调用&#xff0c;类似的还有 。自定义数据格式&#xff0c;基于原生TCP通信&#xff0c;速度快&#xff0c;效率高。早期的webservice&#xff0c;现在热门的dubbo &#xff08;12不再维护、17年维护权交给apac…

【设计模式】行为型设计模式之 迭代器模式

介绍 迭代器模式&#xff08;Iterator Pattern&#xff09; 是行为设计模式之一&#xff0c;它提供了一种访问集合对象&#xff08;如列表、数组或其他集合结构&#xff09;中元素的方式&#xff0c;而不需要暴露集合的内部结构。迭代器模式定义了一个迭代器接口&#xff0c;该…

专业学习|南开大学《随机过程》学习笔记(一)

&#xff08;1&#xff09;有哪些经典的关于基本随机过程的书籍推荐&#xff1f; 对于想要系统学习基本随机过程的学生来说&#xff0c;可以参考Sheldon M.Rose编著的经典著作《随机过程》。该书涉及的内容也比较宽泛。但并不局限于单个细节论证。 此外&#xff0c;萨缪尔科林(…

Vulnhub靶机之reven 1

一、信息收集 nmap扫描网段&#xff0c;靶机地址为192.168.145.129。 nmap -sP 192.168.145.* 扫一下端口&#xff0c;开放了22、80、111、50967。 nmap -sT -T4 -p1-65535 192.168.145.129 再看一下目录情况&#xff0c;发现一个疑似后台登录的地址。 dirsearch -u http://…

DeepSeek-7B-chat 4bits量化 Qlora 微调

在本文中我们将学习DeepSeek量化微调的方法&#xff0c;并且从微调结果体会大模型微调的重要性。 引言 在当前快速发展的自然语言处理领域&#xff0c;模型的精度和效率是关键。量化和微调技术可以有效提高模型性能。本文将探讨如何对DeepSeek-7B-chat模型进行4bits量化&…

Linux | buildrootfs 添加mkfs.ext3/mkfs.ext4 支持

因个人需要&#xff0c;mkfs.ext3 但是项目中还没有这个命令 所以琢磨了半天 这里将其小记一下 在buildrootfsz中&#xff0c;需要将e2fsprogs 勾选上然后重新编译就好了 make menuconfig Target packages-> Filesystem and flash utilities-> e2fsprogs

stm32编写Modbus步骤

1. modbus协议简介&#xff1a; modbus协议基于rs485总线&#xff0c;采取一主多从的形式&#xff0c;主设备轮询各从设备信息&#xff0c;从设备不主动上报。 日常使用都是RTU模式&#xff0c;协议帧格式如下所示&#xff1a; 地址 功能码 寄存器地址 读取寄存器…

springCloudAlibaba之分布式事务组件---seata

Seata Sea学习分布式事务Seata二阶段提交协议AT模式 Sea学习 事务&#xff1a;事务是访问数据库并更新数据库中各项数据的一个程序执行单元。在关系数据库中&#xff0c;一个事务由一组或多组SQL语句组成。事务应该具有4个属性&#xff1a;原子性、一致性、隔离性、持久性。例如…

数据交换平台_10_activatemq 中间件容错性测试

目录概要 3. 容错测试: - 模拟ActiveMQ在异常情况下的表现,如网络中断、节点故障等。 - 观察ActiveMQ的容错机制是否能够正确处理异常情况,保证消息的可靠传输。 - 根据容错测试结果,优化ActiveMQ的容错机制,确保系统在面对异常情况时能够正确处理并恢复。 设计: 容错测…

WPF-UI布局

WPF布局元素有如下几个&#xff1a; Grid&#xff1a;网格。可以自定义行和列并通过行列的数量、行高和列宽来调整控件的布局。StackPanel&#xff1a;栈式面板。可将包含的元素在竖直或水平方向上排成一条直线&#xff0c;当移除一个元素后&#xff0c;后面的元素会自动向前移…