1、原因：placeholder是h5的新属性，IE10以前的浏览器(8、9)不支持此属性。

 

2、解决方法：jQuery三方插件  jquery-placeholder

3、快速开始：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>test</title>
  5. <script type="text/javascript" src="jquery-1.9.1.js"></script>
  6. <!--[if lte IE 9]>
  7. <script src="../../js/jquery/jquery.placeholder.min.js"></script>
  8. <script>
  9. $(function(){
  10. $('input[placeholder]').placeholder();
  11. });
  12. </script>
  13. <![endif]-->
  14. </head>
  15. <style type="text/css">
  16. input{
  17. width: 100px;
  18. height: 50px;
  19. border: 1px solid red;
  20. }
  21. .placeholder {
  22. color: #ccc;
  23. }
  24. </style>
  25. <body>
  26. <input type="text" placeholder="dfdsfdsfad"/>
  27. </body>
  28. </html>

4、注：此插件和jquery validate混合使用时，密码框password会略过校验，因为新生成的input并没有name属性。解决方法：点击提交按钮时，用js代码给新生成的input添加name属性

placeholder兼容IE8解决方案的更多相关文章

  1. location.origin不兼容IE8解决方案

    最近项目中遇到一个问题,在ajax跟后台交互时需要传一个全路径url.项目上线后,在谷歌,火狐,360等浏览器访问一切正常.但唯独IE8下出现问题,提示url:undefined ! 这就尴尬了!!! ...

  2. placeholder兼容ie8

    <script type="text/javascript">     if( !('placeholder' in document.createElement('i ...

  3. 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能

    当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.ap ...

  4. placeholder兼容方法（兼容IE8以上浏览器）

    //placeholder兼容方法(兼容IE8以上浏览器) var JPlaceHolder = { //检测 _check: function () { return 'placeholder' i ...

  5. css 完美垂直居中解决方案兼容ie8以上等其他浏览器

    css 完美垂直居中解决方案兼容ie8以上等其他浏览器 <pre><!DOCTYPE html><html><head> <title>DI ...

  6. IE8 placeholder兼容+Password兼容

    对于placeholder兼容问题 IE系列的大部分不兼容 使用JQ插件解决这个问题,确实用法很简单 jS下载地址http://www.ijquery.cn/js/jquery.placeholder ...

  7. 兼容ie8总结

    最近做了个兼容ie8的项目,把遇到的一些坑总结一下,欢迎大神指正,共勉. 一. js相关 1.  关于库的引用 jquery只能引用1.x的版本,swiper只能引用2.x的版本. 2. 动态生成的d ...

  8. bootstrap3 兼容IE8浏览器

    近期在使用bootstrap这个优秀的前端框架,这个框架非常强大,框架里面有下拉菜单.按钮组.按钮下拉菜单.导航.导航条.面包屑.分页.排版.缩略图.警告对话框.进度条.媒体对象等,bootstrap ...

  9. bootstrap兼容IE8的一些注意

    准备 bootstrap 3.3.5 jQuery 1.12.0 注意 支持html5 需要引入html5.js 支持placeholder 需要引入placeholder.js ie8 不支持 fo ...

随机推荐

  1. css遮罩层

    父元素:position:fixed; 让子元素居中对齐:position:absolute;top:0;bottom:0;left:0;right:0;margin:auto; <style& ...

  2. Oozie4.2 安装部署、以及example测试

    编译: 使用的环境是:Hadoop2.6.0.Spark1.4.0.Hive0.13.1.Sqoop1.4.4 编译Oozie的命令:./mkdistro.sh -Phadoop-2 -Dhadoop ...

  3. 【SSH】Hibernate关联映射

    一对一关联映射 一对一主键关联映射    一句话:不加字段.主键既是主键又是外键. 一对一单向主键关联映射 配置: <span style="font-family:KaiTi_GB2 ...

  4. Eclipse Axis2 插件将代码生成WSDL指南

    Eclipse Axis2 插件将代码生成WSDL指南 快速学习手册 开发工具:https://spring.io/tools 插件地址:http://axis.apache.org/axis2/ja ...

  5. C#中自定义属性的例子

    自定义属性的作用 有时候我们需要给一个类或者类中的成员加上一些属性或者附加信息,让类或者变量的功能更明确可控制的细粒度更高,打个简单的比方:数据库里面的一张表,表中的每一个字段都有很多属性,如是否主键 ...

  6. C#对Sql Server TEXT字段存储的实现（使用存储过程）

    1.这里先准备数据库:在数据库中建立一个News数据表,字段为id,title,content2.建立用于插入news的存储过程:NewsInsert和NewsUpdate,代码如下: ),@cont ...

  7. 导入第三方Jar包到Nexus私服

    公司里面有自己的公共代码库,如果希望交给Maven进行管理,可以搭建Nexus服务器,将公司的公共代码库的代码打成jar包,然后上传到Nexus私服服务器上,项目组的成员就可以在Maven项目中通过添 ...

  8. LeetCode: Pascal's Triangle 解题报告

    Pascal's Triangle Given numRows, generate the first numRows of Pascal's triangle. For example, given ...

  9. 备份Android机上的照片

    [本文出自天外归云的博客园] 一年一度的春节放假开始了,今天收拾柜子发现了一台上大学时候用的android机,里面有几百张当年的回忆. 写了个shell脚本遍历了下照片存放的路径,然后用一个pytho ...

  10. 4. Stacked AutoEncoder（堆栈自动编码器）

    1. AutoEncoder介绍 2. Applications of AutoEncoder in NLP 3. Recursive Autoencoder(递归自动编码器) 4. Stacked ...