我还是喜欢用jquery来实现,不管页面中多少个输入框需要实现聚焦,失焦,都公有,我常用的方法是:

遍历该页面中的input框,获取输入框中的val值,当该输入框聚焦的时候跟存放的oldValue值进行比较,如果值相同,就把该值变为空,失焦的时候,把原来存放的值再吃赋值到val上,具体代码如下:

$(function(){

    $("input[class*=input]").each(function(){
var oldValue=$(this).val(); $(this).focus(function(){
if($(this).val()==oldValue){
$(this).val('');
}
})
.blur(function(){
if($(this).val()==""){
$(this).val(oldValue)
}
})
}); })

js实现方法一:直接在input中添加

<input type="text" onfocus="if(this.value=='聚焦吧') this.value='';" onblur="if(this.value=='') this.value='聚焦吧';" value="聚焦吧" name="name">

js实现方法二:

html代码

<input type="text" value="聚焦吧" id="myinput" /> 

js代码如下:

function addListener(element,e,fn){
if(element.addEventListener){
element.addEventListener(e,fn,false);
}else{
element.attachEvent("on" + e,fn);
}
}
var myinput = document.getElementById("myinput");
addListener(myinput,"click",function(){
myinput.value = "";
})
addListener(myinput,"blur",function(){
myinput.value = "聚焦吧";
})

当然当页面中有聚焦,失焦的时候,我还是推荐使用jquery的这种实现方式的。

通过jquery 获取文本框的聚焦和失焦方法的更多相关文章

  1. js/jquery获取文本框的值与改变文本框的值

    我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...

  2. jquery获取文本框的内容

    使用jquery获取文本框的内容有以下几种: 1.根据ID取值(id属性): // javascript <script type="text/javascript"> ...

  3. jQuery获取文本节点之 text()/val()/html() 方法区别

    1. 无参html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档,返回的是一个String 例子: html页面代码:<div><p&g ...

  4. jquery设置文本框值 与获取文本框的值

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. jquery clone 获取文本框值得问题

    1 clone 出来的文本框 默认不会把原来的事件也带过去 如果使用 $("#").clone(true);   true  可以将原来的事件带过去 获取文本框的值 可以使用事件 ...

  6. jQuery清除文本框,内容并设置不可用

    JQuery清除文本框,内容并设置不可用  如果是设置只读,则将disabled换成readonly function CleanText(textid) { $("#"+text ...

  7. 用Jquery控制文本框只能输入数字和字母

    用Jquery控制文本框只能输入数字和字母 $.fn.onlyNum = function () { $(this).keypress(function (event) { var eventObj ...

  8. React-Native获取文本框的值

    要想获取文本框的值,首先我们需要看一下官方文档的解释: 这里的意思是说当文本框的内容改变的时候,文本框的输入的内容就会作为一个参数进行传递.因此我们就可以获取到文本框里面的内容就好了. constru ...

  9. JQuery 限制文本框只能输入数字和小数点

    $(function(){ /*JQuery 限制文本框只能输入数字*/ $(".NumText").keyup(function(){ $(this).val($(this).v ...

随机推荐

  1. gcc makefile

    $* 不包含扩展名的目标文件名称 $< 第一个依赖文件名称 $? 所有时间戳比目标文件晚的依赖文件 $@ 目标文件完整名称 $^ 所有不重复的依赖文件

  2. bat文件创建mysql数据库 数据库名为meter

    -- 详见附件,已自测通过      //修改为mysql安装路径     C:\Program Files\MySQL\MySQL Server 5.5"      createtestd ...

  3. Understanding Python metaclasses

    转载:https://blog.ionelmc.ro/2015/02/09/understanding-python-metaclasses/ None of the existing article ...

  4. Ext.Form 自动填写表单内容

    前台: 表单必须含有name属性 if (action == 'edit' || action == 'show') { MyForm1.getForm().load({ url: '/data/cu ...

  5. hitTest方法与PointInside方法

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  6. 初探接口测试框架--python系列5

    点击标题下「蓝色微信名」可快速关注 坚持的是分享,搬运的是知识,图的是大家的进步,没有收费的培训,没有虚度的吹水,喜欢就关注.转发(免费帮助更多伙伴)等来交流,想了解的知识请留言,给你带来更多价值,是 ...

  7. jmeter随笔(9)--有两种编码风格,导致数据乱码

    问题:在一个网站,有两种编码风格,导致数据乱码 解决办法: 1.首先设置jmeter的配置文件 2.针对要求是utf-8格式的这样的请求,做单独的编码处理(beanshell处理) 3.运行,在htm ...

  8. git和svn的区别001

    Git和SVN之间的五个基本区别 中文原文地址:http://blog.jobbole.com/31444/ 友情链接git和svn链接2:http://blog.csdn.net/sunboy_20 ...

  9. It English 每日更新

    unary operator 一元运算符 short circuit evaluation 短路经查询

  10. The BKS System for the Philco-2000 学习笔记

    最近因为学业需要阅读这一篇论文......一把鼻涕一把泪地翻了一边以求更好地理解,谁让我英语渣呢....有很多地方翻译得感觉还是有问题或者不流畅,还请大家多多指教. The BKS System fo ...