jquery获取焦点和失去焦点事件代码
input失去焦点和获得焦点
鼠标在搜索框中点击的时候里面的文字就消失了。
我们在做网站的时候经常会用到搜索框的获得焦点和失去焦点的事件,因为懒,每次都去写非常的烦,于是就一劳永逸,遇到类似情况就来调用一下就OK 了 。
相关js代码如下:
<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>
jquery获取和失去焦点事件
<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#username').focus(function ()//获取焦点触发的时间
{
$('#username').val('');
})
$('#username').blur(function () 失去焦点时触发的时间
{
if ($('#username').val() == 'marry') {
$('#q').text('用户名已存在!')
}
else { $('#q').text('ok!') }
})
jquery获取焦点和失去焦点事件代码的更多相关文章
- Knockout: 实践CSS绑定和jQuery的blur失去焦点事件, 给未通过校验的输入框添加红色边框突出显示.
目的: 实践一下Knockout提供的CSS绑定功能和JQuery的blur失去焦点事件, 这次不使用Knockout的afterkeydown事件了. 步骤: 先在htm中添加.error的css样 ...
- jquery之鼠标失去焦点事件
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- jquery $.extend()扩展插件获取焦点或失去焦点事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- jquery获取焦点和失去焦点
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- jquery实现输入框实时输入触发事件代码
$('.aa').bind('input propertychange', function() { searchProductClassbyName(); }); function searchPr ...
- javascript 获取焦点和失去焦点事件
利用传参的方式提高方法的复用性 这里涉及到JavaScript的字符串拼接操作 </tr> <<tr height="40px"> <td> ...
- Knockout: 使用CSS绑定和event的blur失去焦点事件, 给未通过校验的输入框添加红色边框突出显示.
目的:使用knockout提供的机制实现输入框失去焦点后的校验工作,并使用CSS绑定给未通过校验的输入框添加红色边框突出显示. 步骤: 先在htm中添加.error的css样式, 并在输入框中的dat ...
- jquery 触发/失去焦点事件例子详解
触发焦点: $("Element").focus() 触发每一个匹配元素获得焦点事件. $("Element").focus(function) 事件会在获得焦 ...
- jQuery之绑定焦点事件(焦点事件失效)
在使用jQuery绑定事件时,若某个事件不存在,则该事件后 绑定的事件均失效: 如图所示,若失去焦点事件checkEmail不存在, 会导致后面的事件checkMobile,和事件checkBirth ...
随机推荐
- 设置SO_RECVBUF和SO_SENDBUF套接字选项
控制套接字的行为(如修改缓冲区的大小). int getsockopt(int sockfd,int level,int optname,void *optval,socklen_t *optlen) ...
- Jrebel热部署配置完整教程(IntelliJ IDEA、Jrebel、spring boot、springboot、eclipse、Tomcat)
标签:IntelliJ IDEA.Jrebel.spring boot.springboot.eclipse.Tomcat1.安装插件并激活插件安装参考:http://blog.csdn.net/u0 ...
- js学习笔记(延时器)
//setTimeout() //功能:设置一个延时器 //语法:var timer = window.setTimeout(code,millisec); //参数: code:是任何合 ...
- 条件注释判断IE版本
在学习Bootstra的时候看到这么一句话, <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media ...
- 白话图解HTTPS原理
[前言]最近看过几篇文章,内容是关于"全民HTTPS"的.为什么HTTPS,突然会受到如此多业内人士的青睐呢?HTTPS究竟是什么呢?它与HTTP又有怎样的区别呢? 带着这 ...
- C# Dictionary根据Key排序
using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Cons ...
- SQL Server学习之路(三):“增删改查”之“增”
0.目录 1.前言 2.通过SSMS添加数据 3.通过SQL语句添加数据 3.1 添加单条数据 3.2 添加多条数据 4.通过其他表导入数据 4.1 通过数据库中的其他表导入数据 4.2 通过exce ...
- 关于C++编译链接和模板函数
一,关于编译链接编译指的的把编译单元生成目标文件的过程链接是把目标文件链接到一起的过程编译单元:可以认为是一个.c或者.cpp文件.每个编译单元经过预处理会得到一个临时的编译单元.预处理会间接包含其他 ...
- Mybatis框架解析之Builder解析
首先我们从builder这个类入手,首先我们注意到BaseBuilder,其实它的本质上市一个抽象类,它从本质上抽象出了Builder的一切,我猜想这里一定使用了建造者模式,但是这个抽象类里面居然没有 ...
- android手机状态解释,比方android.os.Build.VERSION.SDK
//BOARD 主板 String phoneInfo = "BOARD: " + android.os.Build.BOARD; phoneInfo += ", BOO ...