您的位置:首页 > Web前端 > JQuery

jQuery文本框默认值自动清除和填充的实现

2015-10-06 23:30 671 查看
<ol><li><span style="font-family: Arial, Helvetica, sans-serif;"><script type="text/javascript"></span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">$(document).ready(function(){</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">var i = 0;</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">	</span><span style="font-family: Arial, Helvetica, sans-serif;">$("input").on("focus blur",function(){</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">		</span><span style="font-family: Arial, Helvetica, sans-serif;">//this  表示当前操作对象。是dom对象,可以通过this.value获得值</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">		</span><span style="font-family: Arial, Helvetica, sans-serif;">//$(this).val(i++);</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">		</span><span style="font-family: Arial, Helvetica, sans-serif;">// * 判断当前对象是否被选中 , is() 用于判断</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">		</span><span style="font-family: Arial, Helvetica, sans-serif;">if($(this).is(":focus")){</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">			</span><span style="font-family: Arial, Helvetica, sans-serif;">//获得焦点 --只有内容为默认值时才清空</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">			</span><span style="font-family: Arial, Helvetica, sans-serif;">if( $(this).val() == $(this).attr("defaultValue") ){</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">				</span><span style="font-family: Arial, Helvetica, sans-serif;">$(this).val("");</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">			</span><span style="font-family: Arial, Helvetica, sans-serif;">}</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">		</span><span style="font-family: Arial, Helvetica, sans-serif;">} else {</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">			</span><span style="font-family: Arial, Helvetica, sans-serif;">//失去焦点  , attr() 通过属性名获得值 -- 如果没有内容,使用默认值</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">			</span><span style="font-family: Arial, Helvetica, sans-serif;">if ($(this).val() == "") {</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">				</span><span style="font-family: Arial, Helvetica, sans-serif;">$(this).val($(this).attr("defaultValue"));</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">			</span><span style="font-family: Arial, Helvetica, sans-serif;">}</span></li><li><span style="font-family: Arial, Helvetica, sans-serif;">		</span><span style="font-family: Arial, Helvetica, sans-serif;">}</span></li><li><span style="font-family: Arial, Helvetica, sans-serif; font-weight: bold;">});</span></li><li> </li><li><input type="text" value="请输入账号" defaultValue="请输入账号" /></li><li><input type="text" value="请输入密码" defaultValue="请输入密码"/>
</li></ol>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery