输入框提示文字跨浏览器的placeholder-jQuery版

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

例子展示:

http://www.ifrans.cn/demo/enplaceholder.html

jquery.enplaceholder.js 下载

$(‘#form1 input,#form1 textarea‘).placeholder();

在不支持placeholder的浏览器下,通过插入悬浮的span元素方式模拟

文本框内容改变时placeholder消失:

$(‘#username2,#password‘).placeholder({isUseSpan:true});
时间: 2024-10-12 23:37:44

输入框提示文字跨浏览器的placeholder-jQuery版的相关文章

跨浏览器实现placeholder效果的jQuery插件

曾经遇到这样一个问题,处理IE8密码框placeholder属性兼容性.几经周折,这个方案是可以解决问题的. 1.jsp页面引入js插件 <script type="text/javascript" src="<%=basePath%>/login.js" ></script> 2.页面初始化代码 <script type="text/javascript"> //input提示信息 效果插件 针对

跨浏览器的placeholder – 原生JS版

转自来源 : http://www.ifrans.cn/placehoder/ 跨浏览器的placeholder – 原生JS版 html5为input元素新增了一个属性”placeholder”,提供对输入字段预期值的提示信息,input为空且未获得焦点时显示,获得焦点时消失,非常实用.目前,大部分现代浏览器都对placeholder属性提供了支持,IE10也是支持的.如果需要使IE6~IE9等浏览器支持placeholder,只有借助js了. 在这些不支持原生placeholder属性的浏览

&lt;textarea&gt;输入框提示文字

背景 看了过时的资料,花费大把时间,不过也有收获,还是写写吧! 分析 有同学可能想到直接在<textarea>标签内输入帮助文字,但是这又有一个新问题--因为<textarea>设置了默认内容,如果用户不点击输入框(更改输入框的文本),而直接提交,就把默认的提示内容提交到后台了. 参考其他同学的解决方案:创建一个div,这个div包含了帮助文字.<textarea>,并通过css的position属性来控制,将帮助文字显示到<textarea>中,点击<

HTml输入框提示文字

1 <input type="password" placeholder="请输入密码" /> 效果如下

输入框提示文字js

<input style="margin-right: 0px; padding-right: 0px;" class="text" required="" value="请输入用户名" onclick="if(this.value=='请输入用户名'){this.value=''}" onblur="if(this.value==''){this.value='请输入用户名'}"

跨浏览器的placehold

如何实现跨浏览器的placeholder效果呢? 先看下效果 js代码如下: $('#username').placeholder({ word: '用户名', color: '#ddd', normalFontColor: '#f00', maxLen: 4, minLen: 2, errorBorderClass: 'errorBorder', keyup_callback: function () { console.log('keyup_callback'); } }); $('#pas

jQuery 实现IE10以下浏览器的placeholder效果

/* *jQuery版本:jQuery-1.8.3.min.js *测试的浏览器:IE8,IETester下的IE6-IE9 */ placeholder是HTML5<input>的属性之一,在不同的浏览器中会有不同的显示效果: 在Chrome( v31.0.1650.63 m).Firefox( v21.0 ).360安全( v6.3 极速模式 )中,输入栏获得焦点后,提示文字并不消失,如图( Chrome ): 获得焦点前: 获得焦点时: 偏偏IE11要搞点特殊: 获得焦点前: 获得焦点时

【jquery】基于 jquery 实现 ie 浏览器兼容 placeholder 效果

placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于以下类型的 input 标签:text, search, url, telephone, email 以及 password. 我们先看下在谷歌浏览器中的效果,如图所示: 获得焦点时: 输入字段: 因为是 html5 属性,自然低版本的浏览器比如 ie6-8 不兼容.下面就介绍下如何在低版本浏览器中

跨浏览器的placeholder-jQuery版(jQuery插件EnPlaceholder)

案例:整搜索框,需要默认占位符为"请输入关键词",获取焦点时,占位符消失或不可用(不影响正常输入),丢失焦点后,若用户无内容输入,占位符继续出现,继续占位.这种代码我想前端们已经很容易就写出来了吧,现在HTML5原生就有这个"placeholder"属性,效果与上边案例描述的一样(各支持的浏览器内部表现可能不一致,但是作用是一致的),那么这一属性该怎么优雅降级到支持所有现代浏览器呢?答案还是脚本即JavaScript. 上述案例的一个图例:     下面我们就使用