input输入框获得、失去焦点添加事件
onBlur:当输入框失去焦点后
onFocus:当输入框获得焦点后
这两个JavaScript事件是写在html标签中的例如：
<input type="text" onBlur=" " onFocus=" " />
使用jQuery的实现方法为：
对于元素的焦点事件，我们可以使用jQuery的焦点函数focus(),blur()。
focus()：得到焦点时使用，blur()：失去焦点时使用。
代码如下:
同样可以使用jQuery中提供的:focus伪类来判定元素是否获取焦点；
// Get the focused element:
var $focused = $(':focus'); // No jQuery:
var focused = document.activeElement; // Does the element have focus:
var hasFocus = $('input').is(':focus'); // No jQuery:
elem === elem.ownerDocument.activeElement;
下面写一个实例：
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<style>
.bor{
border:3px solid red;
}
</style>
<BODY>
<input type="text"/>
<script type="text/javascript" src="jquery-1.11.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").focus(function(){
$(this).addClass("bor");
});
$("input").blur(function(){
$(this).removeClass("bor");
});
});
</script>
</BODY>
</HTML>
当然还可以根据获取元素的状态修改其他元素的各项属性，或者是需要发生的事件
input输入框获得、失去焦点添加事件的更多相关文章
- input 输入框获得/失去焦点时隐藏/显示文字(jquery版)
input输入框在获得或失去焦点时隐藏或显示文字,这样的焦点效果想必很多朋友在填写form表格的时候都曾见识过吧,本文使用jquery实现以下,感兴趣的朋友可以参考下哈 大家可以看效果图的搜索输入框, ...
- input输入框，回车激活按钮事件代码
<input type="text" name="输入框ID" id="输入框ID" onkeypress="if(even ...
- input 输入框默认获得焦点
JavaScript实现默认焦点: 如下写<body>标签: <body onload="window.formLogin.user.focus()"> & ...
- input输入框focus获得焦点边缘发亮
从某个插件上摘下来的代码 <html> <head> <title> New Document </title> <style> texta ...
- input输入框失去焦点，软键盘关闭后，滚动的页面无法恢复到原来位置
H5微信页面开发,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,导致弹框里的按钮响应区域错位. 解决方案:给输入框(或select选择框)添加失去焦点的 ...
- H5微信页面开发 IOS系统 input输入框失去焦点，软键盘关闭后，被撑起的页面无法回退到原来正常的位置，导致弹框里的按钮响应区域错位
H5微信页面开发,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,导致弹框里的按钮响应区域错位. 解决方案:给输入框(或select选择框)添加失去焦点的 ...
- oninput、onchange与onpropertychange事件的区别, 与input输入框实时检测
这几天项目着急,同时也学到好多以前没有接触过的知识.oninput.onchange与onpropertychange事件的区别, 与input输入框实时检测 onchange事件只在键盘或者鼠标操作 ...
- input输入框的的input事件和change事件以及change和blur事件的区别
input输入框的 oninput事件 ,在用户输入的时候触发,只要元素值发生变化就会触发 input输入框的 onchange事件 ,要在输入框失去焦点的时候触发事件,当鼠标在其他地方点击一下才会触 ...
- input输入框的input事件和change事件
input输入框的onchange事件,要在 input 失去焦点的时候才会触发: 在输入框内容变化的时候不会触发change,当鼠标在其他地方点一下才会触发: onchange 事件也可用于单选框与 ...
随机推荐
- rem的解决方案
http://www.qdfuns.com/notes/32967/37b8f127797c6c2b66f2c1dc6d133e45.html rem 作为一个低调的长度单位,由于手机端网页的兴起,在 ...
- 访问 IIS 元数据库失败 解决办法
装了VS2005再装IIS,结果出了些小问题访问IIS元数据库失败思考可能是次序出了问题,解决 1.打开CMD,进入 C:\WINDOWS\Microsoft.NET\Framework\v2.0.5 ...
- noip 2018 day1 T1 铺设道路 贪心
Code: #include<cstdio> using namespace std; int main() { int last=0,ans=0; int n;scanf("% ...
- hdu5024
思路要开阔些,或者说要转化一下思路,别太死 把每一个点当拐点,爆一边就能够.用记忆化搜索也行.都不会超时 #include<bits/stdc++.h> using namespace s ...
- php中array_merge函数
php中array_merge函数 一.array_merge简介 (PHP 4, PHP 5, PHP 7) array_merge — 合并一个或多个数组 说明¶ array array_merg ...
- javafx mouseEvent
public class EffectTest extends Application { Path path; @Override public void start(Stage primarySt ...
- javafx DropShadow
public class EffectTest extends Application { DropShadow shadow = new DropShadow(); public static vo ...
- mysql判断一个字符串是否包含某子串 【转】
文章出处:mysql判断一个字符串是否包含某子串 使用locate(substr,str)函数,如果包含,返回>0的数,否则返回0 例子:判断site表中的url是否包含'http://'子串, ...
- poj 2503 哈希 Map 字典树
Babelfish Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 36967 Accepted: 15749 Descr ...
- VBA调试利器debug.print
作者:iamlaosong 百度一下.非常easy找到debug.print解释和使用介绍.事实上非常简单.就是将代码运行结果显示在"马上窗体"中,但不影响程序运行.VBA程序调试 ...