我想利用jquery在密码域的上方覆盖一个div,div中显示的是灰色的提示文字“请输入密码”
想要达到的效果是，当点击密码域获得焦点的时候，div隐藏。当密码域失去焦点
的时候首先判断密码域中是否输入了密码，如果没输入，那么div显示。如果输入了
div继续隐藏.
<style type="text/css"> #pass_div{ position: relative; height:18px; } #tip_div{ line-height: 18px; font: 12px/18px "宋体"; color: #999; padding-left:5px; } #pass_div input{ border: 1px solid #ddd; background: none; position: absolute; height:15px; width:100px; top:0; } </style> <div id="pass_div"> <div id="tip_div">请输入密码</div> <input type="password" name="password"> </div> <script language="javascript" type="text/javascript"> $(document).ready(function(){ $("input[name='password']").focus(function(){ $("#tip_div").html(""); }).blur(function(){ if($(this).val()==""){ $("#tip_div").html("请输入密码"); } }); }); </script>
<script type="text/javascript" src="http:-//www.-coding123.-net/js/jquery.js"></script> <input type="password" id="pwd" /> <div id="dvPwd" style="display:none;position:absolute;color:#666">请输入密码！</div> <script type="text/javascript"> $(function () { var input = $('#pwd'), dv = $('#dvPwd'); dv.css({ width: input.outerWidth(), height: input.outerHeight(), top: input.offset().top, left: input.offset().left, display: 'block' }).click(function () { $(this).hide(); input.focus(); }); input.blur(function () { if (this.value == '') dv.show(); }); }); </script>