IE兼容html5的placeholder属性(IE如何兼容placeholder属性)
2016-11-14 09:05
696 查看
IE如何兼容placeholder属性
HTML5对Web Form做了许多增强,比如input新增的type类型、Form Validation等。Placeholder是HTML5新增的另一个属性,当input或者textarea设置了该属性后,该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点时,提示文字消失。以前要实现这效果都是用JavaScript来控制才能实现。但现在placeholder属性既可以完美实现。<input id="t1" type="text" placeholder="请输入文字" />
但是测试中发现,ie9以下的版本并不支持这个属性,所以必须兼容,方法也很简单用jQuery实现placeholder的功能。下面
直接直接上代码:
// 兼容ie9 的placeholder属性 $(function() { function input(obj, val) { var $input = obj; var val = val; $input.attr({value:val}); $input.focus(function() { if ($input.val() == val) { $(this).attr({value:""}); } }).blur(function() { if ($input.val() == "") { $(this).attr({value:val}); } }); } $('input').not("input[type='password']").each(function() { var self = $(this); var val = self.attr("placeholder"); input(self, val); // alert(val); }); });
保存一个js文件直接用,原理就不多解释了,很简单。
by:http://www.leasonlove.cn/
相关文章推荐
- html5的placeholder属性(IE如何兼容placeholder属性)
- 【工作笔记五】html5的placeholder属性(IE如何兼容placeholder属性)
- Html5的placeholder属性(IE兼容)
- Html5的placeholder属性(IE兼容)实现代码
- IE如何兼容placeholder属性
- Html5的placeholder属性(IE兼容)
- HTML5表单提示placeholder属性兼容IE
- ie兼容html5中placeholder属性
- Html5的placeholder属性(IE兼容)实现代码
- 让IE支持placeholder属性,兼容IE6,7,8,9
- 让IE下支持Html5的placeholder属性
- (转)html5 Placeholder属性兼容IE6、7方法
- IE下如何实现placeholder属性
- html5 placeholder ie 不兼容问题 解决方案
- IE兼容实现HTML5的placeholder
- IE不支持HTML5表单属性placeholder的解决办法
- 解决IE不支持HTML5表单属性placeholder的问题
- 关于HTML5属性placeHolder在手机浏览器不兼容问题
- 【转】如何使html5语义化标签兼容ie
- 兼容HTML5placeholder属性