信鸽网

jQuery简单实现input文本框内灰色提示文本效果的方法

  作者：bea

本文实例讲述了jQuery简单实现input文本框内灰色提示文本效果的方法。分享给大家供大家参考，具体如下： $(function(){ $(".grayTips").each(function(){ //遍历每个文本框 var objTextBox=$(this); var oldText=$.trim(objTextBox.val()); objTextBox.css("color","#888"); objTextBox.focus(

本文实例讲述了jQuery简单实现input文本框内灰色提示文本效果的方法。分享给大家供大家参考，具体如下：




$(function(){  

  $(".grayTips").each(function(){ //遍历每个文本框

    var objTextBox=$(this);

    var oldText=$.trim(objTextBox.val());

    objTextBox.css("color","#888"); 

    objTextBox.focus(function(){

      if(objTextBox.val()!=oldText){

        objTextBox.css("color","#000");

      }

      else{

        objTextBox.val("").css("color","#888");

      }

    });

    objTextBox.blur(function(){

      if(objTextBox.val()==""){

        objTextBox.val(oldText).css("color","#888");

      }

    });

    objTextBox.keydown(function(){

      objTextBox.css("color","#000");

    });

  });

});


说明：需要引入jquery.js文件  input和TextBox都有效




$(function(){

 $(".grayTip").each(function(){

  var $input=$(this);

  $input.css("color","#888");

  var oldText=$.trim($input.val());

  $input.focus(function(){

  var newText=$.trim($input.val());

  if (newText==oldText){

   $input.val("");   

  }

  $input.css("color","#000");

  });

  $input.blur(function(){

  var newText=$.trim($input.val());

  if(newText==""){

   $input.val(oldText);

   $input.css("color","#888");

  }

  });

 }); 

});


希望本文所述对大家jQuery程序设计有所帮助。




有用  |  无用

猜你喜欢

您可能感兴趣的文章: