js获取焦点事件和失去焦点事件

 分类:js知识时间:2022-06-15点击: 2022前端视频教程(自学必看)

js中获取焦点事件是什么?在input框中点击的时候里面的文字就消失了,这就是获取焦点事件,我们经常会用到在input框中获得焦点事件focus和失去焦点事件blur,获取焦点事件和失去焦点事件的使用方法,请看下面的实例代码。    

js获取焦点事件和失去焦点事件

1、html代码如下:

<form action=""method="post">
   <input name="'' type="text"  id="searchkey" value="输入搜索关键词"/>
   <input name="'' type="submit"  id="searchbtn'' value="搜索"/>
</form>

2、js获取焦点事件和失去焦点事件代码如下:

注:为了方便使用了jQuery

     $(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");
   });
除注明外的文章,均为来源:老汤博客,转载请保留本文地址!
原文地址: