Jquery使用Id获取焦点和失去焦点有2种方法

先用第一种(val()=="空"):

  

 <div>
<input type="text" id="address" value="请输入邮箱地址" />
<input type="text" id="password" value="请输入邮箱密码" />
<input type="button" value="登录" />
</div> <script type="text/javascript">
$("#address").focus(function () { //focus获取鼠标焦点时,如果输入框的值为 "请输入邮箱地址" ,则将输入框中的值清空
var txt_value = $(this).val(); //获取地址文本框的值
if (txt_value == "请输入邮箱地址")
{
$(this).val("");
}
});
$("#address").blur(function () { //blur失去鼠标焦点时,如果输入框的值为空,则将输入框中的值为 "请输入邮箱地址"
var txt_value = $(this).val(); //获取地址文本框的值
if (txt_value == "") {
$(this).val("请输入邮箱地址");
}
}); $("#password").focus(function () { //focus获取鼠标焦点时,如果输入框的值为 "请输入邮箱密码" ,则将输入框中的值清空
var txt_value = $(this).val(); //获取地址文本框的值
if (txt_value == "请输入邮箱密码") {
$(this).val("");
}
});
$("#password").blur(function () { //blur失去鼠标焦点时,如果输入框的值为空,则将输入框中的值为 "请输入邮箱密码"
var txt_value = $(this).val(); //获取地址文本框的值
if (txt_value == "") {
$(this).val("请输入邮箱密码");
}
});
</script>

这是第二种(defaultValue):

 <div>
<input type="text" id="address" value="请输入邮箱地址" />
<input type="text" id="password" value="请输入邮箱密码" />
<input type="button" value="登录" />
</div> <script type="text/javascript">
//还可以使用表单元素的defaultValue属性来实现同样的功能
$("#address").focus(function () {
var txt_value = $(this).val();
if (txt_value == this.defaultValue) { //this指向当前的文本框,this.defaultValue 就是当前文本框的默认值
$(this).val("");
}
});
$("#address").blur(function () {
var txt_value = $(this).val();
if (txt_value =="") {
$(this).val(this.defaultValue);
}
}); $("#password").focus(function () {
var txt_value = $(this).val();
if (txt_value == this.defaultValue) {
$(this).val("");
}
});
$("#password").blur(function () {
var txt_value = $(this).val();
if (txt_value == "") {
$(this).val(this.defaultValue);
}
});
</script>

Jquery使用Id获取焦点和失去焦点的更多相关文章

  1. JQuery下focus()无法自动获取焦点的处理方法 jquery如何使文本框获得焦点

    今天遇见这么一个小小的问题,就是文本框中需要输入内容才可以提交,如果没有输入就提示并使该文本框获得焦点! 这么一个简单的事情如果没有使用 jQuery的话 是不是对象.focus()就可以了, Jav ...

  2. 基于jQuery的网站首页宽屏焦点图幻灯片

    今天给大家分享一款基于jQuery的网站首页宽屏焦点图幻灯片.这款焦点图适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览 ...

  3. jQuery的ID选择器失效问题

    jQuery的ID选择器,在同一项目别的文件中一切正常: 在当前页面,jQuery的其它功能(如:$(document).ready(function(){  alert("ok" ...

  4. jQuery easyUI id选择器 类选择器 标签选择器 属性选择器 及DOM对象和jQuery相互之间的转换

    首先导入js文件 <%@ page language="java" contentType="text/html; charset=UTF-8" page ...

  5. jquery通过id和class取值

    一.Jquery通过id获取Input文本框value值 二.Jquery通过id获取文本内容(1) 三.Jquery通过id获取文本内容(2) 四.Jquey通过class获取文本内容 (注:Jqu ...

  6. jquery获取焦点和失去焦点事件代码

    input失去焦点和获得焦点 鼠标在搜索框中点击的时候里面的文字就消失了. 我们在做网站的时候经常会用到搜索框的获得焦点和失去焦点的事件,因为懒,每次都去写非常的烦,于是就一劳永逸,遇到类似情况就来调 ...

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

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

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

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

  9. jquery获取焦点和失去焦点

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. ansj分词史上最详细教程

    最近的项目需要使用到分词技术.本着不重复造轮子的原则,使用了ansj_seg来进行分词.本文结合博主使用经过,教大家用最快的速度上手使用ansj分词. 1.给ansj来个硬广 项目的github地址: ...

  2. 聊聊jvm系列

    http://blog.csdn.net/column/details/talk-about-jvm.html

  3. centos6下无法使用lsof命令"-bash: lsof: command not found"

    1. 问题描述在centos下, 无法使用命令lsof, 出现以下信息:# lsof -i:3690-bash: lsof: command not found2. 解决方法我们可以通过yum来安装: ...

  4. 无apk,怎么获取app的activity

    在做app自动化测试之前,有个前提条件,就是要获取当前app的包名和当前活动的activity.如果有提供了.apk,就可以直接通过adb命令获取到包名和欢迎页面:有种软件是手机自带的的,我们不知道a ...

  5. android Service 学习总结

    学习android开发已经四五个月,由于项目中职责的原因一直没有接触过Service的实际项目,今天重新学一遍Service用法. 问题: 作为四大组件,为什么需要Service? 它与Thread又 ...

  6. 弱网测试--使用fiddler进行弱网测试

    弱网测试原理以及方法(一) 一.为什么要进行弱网测试? 按照移动特性,各种网络连接协议不同,导致通信的信号不同,速率也不同,影响应用的加载时间.可用性.稳定性 二.什么样的网络属于弱网? 低于2g速率 ...

  7. 《垃圾回收的算法与实现》——增量式垃圾回收与RC Immix算法

    增量式垃圾回收 为了控制最大暂停时间,通过逐渐推进垃圾回收即垃圾回收与mutator交替执行. 三色标记算法 以标记-清除算法为例使用三色标记算法. 利用降低吞吐量来缩短最大停顿时间. 基础 将GC中 ...

  8. 14-hadoop-运行的2种方式

    hadoop的程序运行有, 具体有3种, 除了上一篇(http://www.cnblogs.com/wenbronk/p/6662119.html)提过的直接发布jar上传到hadoop以外, 还有本 ...

  9. H5开发中遇到的问题及解决办法

    记不得什么时候进行H5开发的学习了,只知道是从2016年8月1日开始修复Bug,计划每天把学到的东西以及遇到问题时候的解决方案都记录下来,希望自己能够坚持下去,每天积累一点,希望有所进步吧. 1.Th ...

  10. CentOS探索之路2---使用rpm安装JDK

    使用rpm安装jdk ​ 在前一Linux探索文章中http://www.cnblogs.com/Kidezyq/p/8782728.html,有关于通过yum指令安装原生OpenJDK的命令.当时有 ...