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. Spring Security教程(七):RememberMe功能

    在之前的教程中一笔带过式的讲了下RememberMe记住密码的功能,那篇的Remember功能是最简易的配置,其功能和安全性都不强.这里就配置下security中RememberMe的各种方式. 一. ...

  2. scala中json与对象的转换

    遇到的问题 因为要把spark从es读出来的json数据转换为对象,开始想用case class定义类型,通过fastjson做转换.如下 case class Book (author: Strin ...

  3. 真机提示Undefinedsymbolsforarchitecturearm64

    转自:http://www.haodaima.net/art/2830860 iOS程序模拟器手机运行都正常,archiving出错:Undefined symbols for architectur ...

  4. spring cloud 路由Zuul的高可用

    Zuul的高可用非常关键,因为外部请求到后端微服务的流量都会经过Zuul.故而在生产环境中,我们一般都需要部署高可用的Zuul以避免单点故障. 笔者分两种场景讨论Zuul的高可用. Zuul客户端也注 ...

  5. Socket网络编程--Libev库学习(2)

    这一小节讲各个观察器(Watcher) 在libev下面watcher相当于EventHandler这么一个概念,通常里面会绑定fd回调函数以及我们需要关注的事件. 然后一旦触发事件之后会触发我们使用 ...

  6. HTML5学习笔记(二十三):DOM应用之动态加载脚本

    同步加载和执行JS的情况 在HTML页面的</body>表情之前添加的所有<script>标签,无论是直接嵌入JS代码还是引入外部js代码都是同步执行的,这里的同步执行指的是在 ...

  7. 对JSON格式的城市按照拼音首字母排序

    需求说明: App应用中最常见的一种操作就是对城市按照拼音首字母排序,以方便选择城市.而已有的json格式的城市数据是没有这种排序的. 已有的json格式的城市数据格式如下[简化之后]: 数据格式说明 ...

  8. JAVA-JSP内置对象之application对象获得服务器版本

    相关资料:<21天学通Java Web开发> application对象获得服务器版本1.通过application对象的getMajorVersion()方法和getMinorVersi ...

  9. iOS提示The app icon set named "AppIcon" did not have any applicable content 错误

    按照您的错误提示您应该是,这样设置的吧,看下下图: 如果是的话,请确保您将错有的Icon图片都拽进了Images.xcassets这个文件夹中,如下图所示: 如果您的Icon图片并没有在Images. ...

  10. Android 开发自己的网络收音机3——电台分类(ExpandableListView)

    上一篇文章说了使用SlidingMenu开源项目实现侧滑栏,今天主要是讲解多级列表ExpandableListView的使用,以及如何使用它实现电台分类管理.ExpandableListView是An ...