jquery获取焦点和失去焦点事件代码_Javascript教程-查字典教程网
jquery获取焦点和失去焦点事件代码
jquery获取焦点和失去焦点事件代码
发布时间:2016-12-30 来源:查字典编辑
摘要:input失去焦点和获得焦点鼠标在搜索框中点击的时候里面的文字就消失了。我们在做网站的时候经常会用到搜索框的获得焦点和失去焦点的事件,因为懒...

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>鼠标在搜索框中点击的时候里面的文字就消失了</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!') }

})

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类