我还是喜欢用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. emacs设置代理访问插件仓库

    下面这个配置适合ss (setq url-gateway-method 'socks)(setq socks-server '("Default server" "127 ...

  2. 解决dedev5.7更新出现include\userlogin.class.php on line 21的办法

    第一种情况解决办法:   在dede\templets文件夹 找到 index_body.htm  文件 把这些注释掉. $(function() {    $.get("index_tes ...

  3. Cordova是做什么的

    Cordova提供了一组设备相关的API,通过这组API,移动应用能够以JavaScript访问原生的设备功能,如摄像头.麦克风等. Cordova还提供了一组统一的JavaScript类库,以及为这 ...

  4. inno setup 执行SQL

    参考之:1.可将导入数据的功能写入一个小程序,再外部调用(楼上已经说了):2.可用程序代码:[Setup] AppName=科發醫院管理系統 AppVerName=科發醫院管理系統4.0 AppPub ...

  5. esriSRProjCS4Type Constants

    ArcGIS Developer Help  (Geometry)   esriSRProjCS4Type Constants See Also esriSRProjCSType Constants ...

  6. ArcGIS栅格数据的合并和剪切

    ArcGIS栅格数据的合并和剪切 1.  合并:ArcToolBox-- àDataManagement--à Raster--àRaster Dataset--à Mosaic 或 Mosaic t ...

  7. App can入门

    主干 主干可以认为是整个页面的整体框架布局 上图是截取与ZAKER(原生开发).正益无线(HTML5开发).ZAKER微博界面(原生开发)和HTML5中国(HTML5开发).参考上述界面我们看到大部分 ...

  8. BC之The mook jong

    Problem Description ZJiaQ want to become a strong man, so he decided to play the mook jong.ZJiaQ wan ...

  9. ASP.NET MVC开发微信(二)

  10. Linux下串口ttyS2,ttyS3不能用的问题解决办法

    PC104,Xlinux下,突然发现串口3,4不能用... 以为是硬件的问题,换成wince后,3,4工作正常,排除电路问题 在linux下查看dmesg: serial8250: ttyS0 at ...