jq 获取有焦点的input_jquery获得焦点和失去焦点

前端网站中如果存在一些让用户填写内容的表单元素的话，我们可以使用JQ中获得焦点事件和失去焦点事件，来给用户作出一些提示的内容。今天我们就说一说JQuery下获得焦点和失去焦点的事件的使用方法。

jquery focus()获得焦点事件

focus()方法：当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。

语法：

例：input 输入框获得焦点时改变其边框的颜色

示例代码：

当鼠标移入input中并点击时，input元素会变成如下的形式

jq focus()事件，会为input加入一个CSS样式

jquery blur()失去焦点事件

blur()方法：当元素失去焦点时发生 blur 事件

语法：

例：input失去焦点后，弹出输入框中的内容

示例代码：

运行结果如图：

利用jq blur()失去焦点事件来验证用户输入的内容

JQuery中的blur()失去焦点事件，我们可以用来检查用户在input输入框中输入的内容是否合法，比如以下代码，如果用户输入的内容少于五个字符就给出提示

示例代码：

jq 获取有焦点的input_jquery获得焦点和失去焦点相关推荐

【Android TV 开发】焦点处理 ( 父容器与子组件焦点获取关系处理 | 不同电视设备上的兼容问题 | 触摸获取焦点 | 按键获取焦点 )
Android TV 开发系列文章目录 [Android TV 开发]安卓电视调试 ( 开启网络远程调试 ) [Android TV 开发]焦点处理 ( 父容器与子组件焦点获取关系处理 | 不同电视设 ...
android 焦点的作用,Android中的视图焦点Focus的详细介绍
在非触摸屏设备中接收事件和处理响应的控件是具有焦点(Focused)的控件.一个窗口中一个时间内只能有一个具有焦点的控件.在早期具有滚轮设备的android系统中以及现在的智能TV电视应用中视图的焦点 ...
textarea 聚焦后边框_textarea焦点的用法实现获取焦点清空失去焦点提示效果
这篇文章主要介绍了textarea焦点的用法实现获取焦点清空失去焦点提示效果,需要的朋友可以参考下效果图: 具体实现: 1.textarea标签内容备注: 2.初始化使点击添加按钮时,内容显示最多 ...
JQ手册 JQ方法大全 jq获取表单值与赋值代码 50个JQ的例子
http://hemin.cn/jq/index.html http://www.365mini.com/page/jquery-jquery.htm JQ方法大全http://wenku.baidu ...
jq获取原元素 class
jq获取原元素 class 通过class名获取按 class 查找注意在 class 名称前加一个.: var a = $('.a'); // 所有节点包含 `class="a" ...
js获取url参数vue.js获取url参数 JQ获取url参数
在WEB开发中,时常会用到javascript来获取当前页面的url网址信息,在这里是我的一些获取url信息的小总结. 1.window.location.href(设置或获取整个 URL 为字符串) ...
JQ获取tr 下的第一个 td 标签下相应标签的内容
原文连接https://www.cnblogs.com/eager/p/6930088.html <table class="layui-table" id="al ...
jq获取当前周从星期一到星期天的日期
jq获取当前周从星期一到星期天的日期 const dateOfToday = Date.now() const dayOfToday = (new Date().getDay() + 7 - 1) % ...
jq实现div移入与移出以及获得与失去焦点
<div id='id' style='left:0px'></div> $('#id').animate({left:100+"px"}); 使 ...

jq 获取有焦点的input_jquery获得焦点和失去焦点

jq 获取有焦点的input_jquery获得焦点和失去焦点相关推荐

最新文章

热门文章