在js(jquery)中获得文本框焦点和失去焦点的方法

时间:2024-04-26 17:14:20 

先来看javascript的直接写在了input上


<input name="pwuser" type="text" id="pwuser" class="input" value="楼盘账号" onBlur="if(this.value=='') this.value='楼盘账号';" onFocus="if(this.value=='楼盘账号') this.value='';" />
<input name="pwpwd" type="password" class="input1" value="******" onBlur="if(this.value=='') this.value='******';" onFocus="if(this.value=='******') this.value='';">


jquery实现方法

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

focus():得到焦点时使用,和javascript中的onfocus使用方法相同。
如:


$("p").focus(); 或$("p").focus(fn)


blur():失去焦点时使用,和onblur一样。
如:


$("p").blur(); 或$("p").blur(fn)


实例


<form>
<label for="searchKey" id="lbSearch">搜神马?</label> 这里label覆盖在文本框上,可以更好的控制样式
<input id="searchKey" type="text" />
<input type="submit" value="搜索" />
</form>


jquery代码


$(function() {
$('#searchKey').focus(function() {
$('#lbSearch').text('');
});
$('#searchKey').blur(function() {
var str = $(this).val();
str = $.trim(str);
if(str == '')
$('#lbSearch').text('搜神马?');
});
})


好了相当的不错吧

标签:文本框焦点
0
投稿

猜你喜欢

  • 如何使用索引提高查询速度

    2024-01-15 02:14:15
  • 基于python实现Pycharm断点调试

    2021-05-18 03:16:22
  • vue-swiper的使用教程

    2024-04-27 16:17:56
  • Python检测PE所启用保护方式详解

    2022-03-11 12:36:08
  • js 浏览本地文件夹系统示例代码

    2024-04-17 09:48:23
  • 你知道怎么在淘宝里进行投诉吗?

    2008-06-04 12:00:00
  • Python 爬虫之Beautiful Soup模块使用指南

    2021-10-16 13:28:03
  • python递归调用中的坑:打印有值, 返回却None

    2023-11-02 23:07:42
  • Vue.js 使用v-cloak后仍显示变量的解决方法

    2024-06-07 15:20:56
  • 使用Python脚本生成随机IP的简单方法

    2023-12-30 06:46:28
  • Python实现将长图制作成一个视频

    2022-09-28 06:09:09
  • 解决hive中导入text文件遇到的坑

    2023-06-30 16:28:26
  • Python 找出出现次数超过数组长度一半的元素实例

    2023-06-07 05:50:33
  • jQuery实现网页抖动的菜单抖动效果

    2024-04-19 10:19:04
  • python+selenium操作下拉框

    2021-11-16 13:43:30
  • Python中的asyncio代码详解

    2022-03-14 00:01:33
  • 基于ExtJs框架的B/S高级查询界面

    2008-10-07 18:05:00
  • Python抓新型冠状病毒肺炎疫情数据并绘制全国疫情分布的代码实例

    2022-10-11 23:14:40
  • 如何计算多个订单的核销金额

    2024-01-26 17:56:31
  • 用Dreamweaver实现Real与网页结合

    2010-07-13 12:11:00
  • asp之家 网络编程 m.aspxhome.com