【模拟placeholder】的更多相关文章

在IE8等不支持placeholder属性的浏览器中模拟placeholder效果

placeholder是一个很有用的属性,可以提示用户在input框中输入正确的内容,但是IE8以及IE8一下的浏览器不支持该属性,我们可以使用js来模拟相似的效果.下面直接上代码: <!doctype html> <html> <header> <meta charset="utf-8"> <title>placeholder</title> <style type="text/css"…

获取表单的初始值，模拟placeholder属性

input和textarea有一个默认属性defaultValue,即初始值. 即使在页面操作修改了input和textarea的内容,获取到的defaultValue依然是初始值.可通过该值模拟placeholder属性,而不额外添加任何属性,标签之类. js:  以input为例 jq: 完全模拟placeholder,无需添加任何额外属性和标签. textarea标签模拟过程完全一致:…

jQuery效果之封装模拟placeholder效果，让低版本浏览器也支持

页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" placeholder="请输入用户名" value="" id="username"/> 最多加点样式控制下默认文字的颜色 input::-webkit-input-placeholder{color:#AAAAAA;} 但是在低版本的浏览器却不支…

select标签模拟placeholder属性与一般操作(最重要的是ios某一项被选中的兼容)

1.为了统一样式,常常要模拟placeholder <select> <option disabled selected hidden>请选择</option> <option>what</option> <option>the</option> <option>hell</option> </select> 2.select选中的值和某个值要被选中(ios兼容) <select…

模拟placeholder支持ie8以下处理了密码框只读的问题

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <form id="form1" action=""> <input type="text"…

模拟placeholder

把这个记下来,主要是因为这里的 defaultValue 我之前竟然不知道 <input type="text" value="提示内容" onFocus="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaultValue;this.style.color='#999'}" style=&quo…

js解决IE8、9下placeholder的兼容问题

由于placeholder是html5的新属性,在IE8.IE9下是不能显示的,有兼容性问题. 解决思路: 1.判断目前浏览器是否支持placeholder属性 2.若不支持,则将type="text"的input标签的value值设置为placeholder的值,模拟placeholder效果:若是type="password",则添加一个type="password"的input元素模拟. 代码: <div> <input…

placeholder的兼容处理(jQuery下)

这是一个老问题,结合前辈们的经验,需要处理的问题有一下几个. 1.只有输入框(input/textarea)下的palaceholder属性存在的时候才需要处理这类兼容 2.处理好输入框上焦点和是焦点的文本显示 3.密码输入框比较特殊,因为为其设置显示文本时显示的是一串“***”.这个问题后面分析.处理好前两点还是比较简单的,处理源码为如下 var browserSupport = { placeholder: 'placeholder' in document.createElement('i…

最好用的placeholder插件,jQuery插件EnPlaceholder

EnPlaceholder插件支持密码框哦!实际对比同类的placeholder插件在ie等浏览器下效果做好! 插件效果预览:http://www.wufangbo.com/demo/jquery/30/index.html EnPlaceholder的使用方法 首先在head中分别引入jQuery及本插件 <script type="text/javascript" src="jquery-1.7.2.min.js"></script> &…

JQuery Placeholder - Input提示信息

JQuery Placeholder Placeholder属性是HTML5为Input添加的,在Input上提供一个占位符,文字形式展示输入文字预期值的提示信息. 如: 需要使用:placeholdr.js 内容: /** * @name placeHolder * @class 跨浏览器placeHolder,对于不支持原生placeHolder的浏览器,通过value或插入span元素两种方案模拟 * @param {Object} obj 要应用placeHolder的表单元素对象 *…