onBlur:当输入框失去焦点后 
onFocus:当输入框获得焦点后

这两个JavaScript事件是写在html标签中的例如：

<input  type="text"    onBlur=" " onFocus=" " />

使用jQuery的实现方法为：

　　　　对于元素的焦点事件，我们可以使用jQuery的焦点函数focus(),blur()。

focus()：得到焦点时使用，blur()：失去焦点时使用。

代码如下:

 
$("input").focus(); 或$("input").focus(function(){这里是获取焦点时的事件}) 
$("input").blur(); 或$("input").blur(function(){这里是失去焦点时的事件}) 
 

同样可以使用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文本框获取焦点和失去焦点判断的更多相关文章

  1. jquery注册文本框获取焦点清空,失去焦点赋值的简单实例

    在我们开发过程中特别是用户注册时会有一个效果,就是文本框获取焦点清空提示,如果用户没有输入信息失去焦点赋值上我们的提示语.   <html> <head> <meta h ...

  2. jquery注冊文本框获取焦点清空,失去焦点赋值

    在我们开发过程中特别是用户注冊时会有一个效果.就是文本框获取焦点清空提示,假设用户没有输入信息失去焦点赋值上我们的提示语 <html> <head> <meta http ...

  3. 捕获input 文本框内容改变的事件(onchange,onblur,onPropertyChange比较)

    input 文本框内容改变,可以使用onchange或者onblur来判断,但onchange是在文本内容改变,然后失去焦点的时发生,onblur是在失去焦点时发生,不会自己去判断. 如: <i ...

  4. (转)完美解决 Android WebView 文本框获取焦点后自动放大有关问题

    完美解决 Android WebView 文本框获取焦点后自动放大问题 前几天在写一个项目时,要求在项目中嵌入一个WebView 本来很快就完成了,测试也没有问题.但发给新加坡时,他们测试都会出现文本 ...

  5. input文本框设置和移除默认值

    input文本框设置和移除默认值 这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: ...

  6. HTML input文本框设置和移除默认值

    这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: <input id=&quo ...

  7. 我的插件のinput文本框实现宽度自适应

    先来最后结果:DEMO 介绍一下如何让一个文本框的宽度能够随着文本框中的内容的宽度增长而增长,也就是能够实现宽度自适应效果. 代码实例如下: <!DOCTYPE html> <htm ...

  8. js中input文本框设置和移除默认值

    这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: <input id=&quo ...

  9. input文本框的value属性在页面中不随输入的数据而变化

    今天,在做试验遇到这么一个需求: 一个input文本框,输入值后将标签传到后台,在后台解析标签,发现value仍然是初值,不是我们改变后的值. 例如: <input name="&qu ...

随机推荐

  1. [置顶] 对于最新的Android病毒，Smack完全可以抵御

    我写的有关Smack和Android系统结合的技术博客,希望有志之士可以参透其中奥妙,Smack作为Linux内核安全模块,已经可以移植到Android系统中,如果大家弄清我写的Smack安全策略,可 ...

  2. debian linux 中如何查看软件包是否已经安装和如何安装、卸载软件

    练习 1 方案:确定软件包是否安装 如果您不确定某个软件包是否已经安装,可以使用 dpkg 的 -l (L的小写) 选项: $ dpkg -l zsh No packages found matchi ...

  3. C#_Socket网络编程实现的简单局域网内即时聊天，发送文件，抖动窗口。

    最近接触了C#Socket网络编程,试着做了试试(*^__^*) 实现多个客户端和服务端互相发送消息 发送文件抖动窗口功能 服务端: using System; using System.Collec ...

  4. FalseEasting 和 FalseNorthing

    FalseEasting (东伪偏移) 和FalseNorthing(北伪偏移) FalseEasting (东伪偏移) 投影平面中为避免横轴(经度方向)坐标出现负值,而所加的偏移量.我国规定将高斯- ...

  5. webview笔记

    1. 用户上传文件 webChromeClient的onShowFileChooser这个方法,这将打开一个文件选择器,如果要取消这个请求则是调用filePathCallback.onReceiveV ...

  6. 一个小玩具：NDK编译SDL的例子

    NDK编译SDL 准备: 硬件 一台电脑,实验在Lenovo T430上 一个Android设备,实验在 三星S3/A7 编译环境: Ubuntu 14.04 (ant\java等命令必须支持) 工具 ...

  7. 莫队算法学习笔记【BZOJ2038：小Z的袜子】【SPOJ3267：D-query】

    很久以前傻乎乎地看来源奇怪的资料的时候被各种曼哈顿弄晕了. 然后现在学会的是分块方法.另新创一个分块方法. 让我们考虑这样一个区间询问问题…… 它有如下的性质: 0,n个数,Q个询问. 1,它没有修改 ...

  8. NonUniqueObjectException 问题

    org.hibernate.NonUniqueObjectException: a different object with the same identifier value was alread ...

  9. js ||与&&

    ||:找到结果为true的分项就停止,并返回该分项的值,否则继续执行,如果都没有为true的分项则返回最后分项的值(注意每个分项先转成bool与true进行比较). //例如下面的例子: // &qu ...

  10. php提取身份证号码中的生日日期以及验证是否为未成年人的函数

    php 提取身份证号码中的生日日期以及确定是否成年的一个函数.可以同时确定15位和18位的身份证,经本人亲测,非常好用,分享函数代码如下: <?php //用php从身份证中提取生日,包括15位 ...