您的浏览器过于古老 & 陈旧。为了更好的访问体验, 请 升级你的浏览器
Ready 发布于2014年08月19日 03:36

原创 jQuery 选择器(:focus)详解

4389 次浏览 读完需要≈ 3 分钟

内容目录

jQuery的:focus选择器用于匹配当前获得焦点的元素,将其封装为jQuery对象并返回。

语法

jQuery1.6 新增该选择器。

jQuery( ":focus" )

返回值

返回封装了当前获得焦点的元素的jQuery对象。

如果找不到任何相应的匹配,则返回一个空的jQuery对象。

:focus选择器一般用在事件处理中,用于判断指定元素当前是否获得焦点。一般而言,只有接收键盘事件或用户输入的元素才能获得焦点,例如表单的<input>元素。

示例&说明

以下面这段HTML代码为例:

<div id="n1">
	<input name="name" type="text" label="姓名"><br>
	<input name="age" type="text" label="年龄"><br>
	<input name="cellphone" type="text" label="手机号码">
</div>
<div id="message"></div>

现在,我们为当前获得焦点的<input>元素显示提示信息,则可以编写如下jQuery代码:

// 当<input>元素获得焦点时,在#message中显示"请输入[姓名]"、"请输入[年龄]"等相应的提示信息。
$("input").on("focus blur", function(){
	var me = $(this);
	var msg = me.is(":focus") ? ("请输入[" + me.attr("label") + "]") : "";
	$("#message").html(msg);
});

运行代码

  • CodePlayer技术交流群1
  • CodePlayer技术交流群2

0 条评论

撰写评论

打开导航菜单