对于元素的焦点事件，我们可以使用jQuery的焦点函数focus(),blur()。
focus()：得到焦点时使用，和
javascript
中的onfocus使用方法相同。
|
代码如下
|
复制代码
|
|
$("p").focus(); 或$("p").focus(fn)
|
blur()：失去焦点时使用，和onblur一样。
|
代码如下
|
复制代码
|
|
$("p").blur(); 或$("p").blur(fn)
|
|
代码如下
|
复制代码
|
|
<script type="text/javascript">
$(document).ready(function(){
$("input").focus(function(){
$("input").css("background-color","#FFFFCC");
});
$("input").blur(function(){
$("input").css("background-color","#D6D6FF");
});
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p>
</body>
|
鼠标在搜索框中点击的时候里面的文字就消失了。
|
代码如下
|
复制代码
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>input失去焦点和获得焦点
jquery
焦点事件插件</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
//focusblur
jQuery.focusblur = function(focusid) {
var focusblurid = $(focusid);
var defval = focusblurid.val();
focusblurid.focus(function(){
var thisval = $(this).val();
if(thisval==defval){
$(this).val("");
}
});
focusblurid.blur(function(){
var thisval = $(this).val();
if(thisval==""){
$(this).val(defval);
}
});
};
/*下面是调用方法*/
$.focusblur("#searchkey");
});
</script>
</head>
<body>
<form action="" method="post">
<input name="" type="text" value="输入搜索关键词" id="searchkey"/>
<input name="" type="submit" id="searchbtn" value="搜索"/>
</form>
<p>input失去焦点和获得焦点jquery焦点事件插件，<br/><strong style="color:#F00">鼠标在搜索框中点击的时候里面的文字就消失了</strong>。</p>
</body>
</html>
|
一个根据ajax值来判断是显示或隐藏div
|
代码如下
|
复制代码
|
|
<tr>
<td width='70' height='30' align='right'><span class="red">*</span> 手机：</td>
<td width='198' align='center'><input name="tgmo" type="text" class="tcinp" id="tgmo" size="15"/></td>
<td><span class="gray">用房乐网会员登录名可获取5房乐币
</span></td>
</tr>
js
$(function(){
$('#tgmo').blur(function(){
$.post('post.php?action=check',{'tgmo':$('tgmo').val()},function(data)
{
if( data==0 )
{
$('#sy_a').show();
$('#autoregister').val(1);
}
else
{
$('#sy_a').hide();
$('#autoregister').val(0);
}
});
})
});
|
失去
焦点
事件
的方法 on
blur
="方法名（）" 如下：<input type="text" on
blur
="
blur
ee()">
聚焦
事件
的方法 on
focus
=“方法名2（）”
function
blur
ee(){
var newpwd=$("#newPassword").val();
if (/^[0-9]+.?[0-9]*$/...
焦点
事件
，顾名思义，指的是页面中元素获得或
失去
焦点
时触发的
事件
。
焦点
通常应用于表单元素，如等。当用户点击这些元素或使用键盘导航到它们时，这些元素会获得
焦点
；当用户点击其他区域或切换到另一个元素时，
焦点
会被移除。
focus
和
blur
。前者表示元素获得
焦点
，后者表示元素
失去
焦点
。除此之外，还有一些与
焦点
相关的
事件
，如
focus
in和
focus
out，它们具有不同的触发机制和应用场景。
提示：on
blur
相反
事件
为 on
focus
事件
。ondblclick— 鼠标左键双击
事件
。onmouseover— 鼠标移入
事件
。onmouseout-- 鼠标移出
事件
。onmousemove— 鼠标移动
事件
。onmousedown— 鼠标按下
事件
。oninput---- 内容改变
事件
。onclick— 鼠标左键单击
事件
。onmouseup— 鼠标抬起
事件
。onkeydown— 键盘按下
事件
。onchange— 内容改变
事件
。onkeyup— 键盘抬起
事件
。on
blur
—
失去
焦点
事件
。
获得
焦点
事件
（on
focus
）是当某个元素获得
焦点
时触发
事件
处理程序。
失去
焦点
事件
（on
blur
）是当前元素
失去
焦点
时触发
事件
处理程序。
一般情况下，这两个
事件
是同时使用的。
文本框获得
焦点
时改变背景颜色
本示例是在用户选择页面中的文本框时，改变文本框的背景颜色，当选择其他文本框时，将
失去
焦点
的文本框背景颜色恢复原始状态。
jquery
判断input输入框的值，用到input
事件
，
blur
事件
，
focus
事件
需求：当输入框有字或者正在输入时，右边的圆形取消按钮才出现。否则不出现。 //输入框正在输入时
$("#ipt").on('input',function(){
if(!($('#ipt').val()=='')){
循环scoreForm中设置的prop，显示对应scroeFormProp输入框，@
blur
=“watchInput
Blur
”（v-on:简写成@）监听
失去
焦点
事件
。
jQuery
表单
事件
：
一、
jQuery
中的
focus
()
获取
焦点
事件
与
blur
()
失去
焦点
事件
（鼠标
事件
）：
1.
focus
()
事件
：
当元素获得
焦点
时，触发
focus
事件
。可以通过鼠标点击或者键盘上的TAB导航触发。这将触发所有绑定的
focus
函数
事件
。
【 $(".wrap input").
focus
(function () {
console.log(“input已经
获取
到了
焦点
”); }); 】
2.
blur
()
事件
：
当元素
失去
焦点
时触发
blur
事件
。 这个函数会调用执行绑定到
