输入框提示文字跨浏览器的placeholder-jQuery版（jQuery插件EnPlaceholder）
栏目分类：效果代码发布日期：2014-08-26 来源：互联网浏览次数：次

输入框提示文字跨浏览器的

.fn-clear{zoom:1;}
.fn-clear:after{visibility:hidden;display:block;font-size:0;content:".";clear:both;height:0;}
.fn-hide{display:none;}
.fn-left,.fn-right{display:inline;}
.fn-left{float:left;}
.fn-right{float:right;}
.fn-hide-text{font-size:0;line-height:0;color:rgba(0,0,0,0);}
.sl-wrap,.sl-wrap td,.sl-wrap th{word-wrap:break-word;word-break:break-all;} 
.sl-wrap-table{  table-layout:fixed; }</style>
<form id="form1">
	<h3>通过value方式模拟placeholder</h3>
	<p>$('#form1 input,#form1 textarea').placeholder();</p>
	<p><label for="username1">用户名:</label> <input id="username1" name="username1" placeholder="请输入用户名" required="" type="text" value="" /></p>
	<p><label for="address1">地　址:</label> <input id="address1" name="address1" placeholder="请输入地址" required="" type="text" value="" /></p>
	<p><label for="remarks1">备　注:</label></p>
</form>
<form id="form2">
	<h3>在不支持placeholder的浏览器下，通过插入悬浮的span元素方式模拟</h3>
	<h4>文本框内容改变时placeholder消失:</h4>
	<p>$('#username2,#password').placeholder({isUseSpan:true});</p>
	<p><label for="username2">用户名:</label> <input id="username2" name="username1" placeholder="请输入用户名" required="" type="text" value="" /></p>
	<p><label for="password">密　码:</label> <input id="password" name="password" placeholder="请输入密码" required="" type="password" value="" /></p>
	<p><label for="remarks2">备　注:</label></p>
	<h4>获得焦点时placeholder消失:</h4>
	<p>$('#address2').placeholder({isUseSpan:true,onInput:false});</p>
	<p><label for="address2">地　址:</label> <input id="address2" name="address1" placeholder="请输入地址" required="" type="text" value="" /></p>
</form>
<script>
	$('#form1 input,#form1 textarea').placeholder();
	$('#username2,#password').placeholder({isUseSpan:true});
	$('#address2').placeholder({isUseSpan:true,onInput:false});
	$('#remarks2').placeholder({isUseSpan:true});
</script>

用法：

首先在head中分别引入jQuery及本插件

<script type="text/javascript" src="jquery-1.7.2.min.js">script>

<script type="text/javascript" src="jquery.enplaceholder.js">script>

然后就可以调用鸟

//通过value模拟placeholder

$('input').placeholder();

//通过插入元素模拟placeholder

$('input').placeholder({isUseSpan:true});

相关热词：jQuery插件 jQuery placeholder 输入框

输入框提示文字跨浏览器的placeholder-jQuery版（jQuery插件EnPlaceholder）
栏目分类：效果代码发布日期：2014-08-26 来源：互联网浏览次数：次

相关内容

这些是最新的

热门关键词

热门排行

关于聚合分享

版权声明

输入框提示文字跨浏览器的placeholder-jQuery版（jQuery插件EnPlaceholder） 栏目分类：效果代码 发布日期：2014-08-26 来源：互联网 浏览次数：次

相关内容

这些是最新的

热门关键词

热门排行

关于聚合分享

版权声明

输入框提示文字跨浏览器的placeholder-jQuery版（jQuery插件EnPlaceholder）
栏目分类：效果代码发布日期：2014-08-26 来源：互联网浏览次数：次