`

文本框内提示信息

    博客分类：
  • Html
 
阅读更多 
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> 
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>input test</title>  
<script type="text/javascript"
    src="jquery-1.10.2.js"></script>
<script type="text/javascript">  
function inputTipText(){    
$("input[class*=grayTips]") //所有样式名中含有grayTips的input   
.each(function(){   
   var oldVal=$(this).val();   //默认的提示性文本   
   $(this)   
   .css({"color":"#888","font-size":"14px","font-weight":"bold"})  //灰色  
   .focus(function(){   
    if($(this).val()!=oldVal){$(this).css({"color":"#000","font-weight":"normal"})}else{$(this).val("").css({"color":"#888"})}   
   })   
   .blur(function(){   
    if($(this).val()==""){$(this).val(oldVal).css({"color":"#888"})}   
   })   
   .keydown(function(){$(this).css({"color":"#000","font-weight":"normal"})})   
     
})   
}   
  
$(function(){   
inputTipText();  //直接调用就OK了   
})   
</script>  
</head>  
<body>  
<input type="text" value="输入您的用户名" class="grayTips" />  
<input type="text" value="输入您的登录密码" class="grayTips"/>  
</body>  
</html>
分享到：
| 省份地市级联
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics