让IE8和IE9支持 placeholder
1、原因:placeholder是h5的新属性,IE10以前的浏览器(8、9)不支持此属性。
2、解决方法:jQuery三方插件 jquery-placeholder
3、快速开始:
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<!--[if lte IE 9]>
<script src="../../js/jquery/jquery.placeholder.min.js"></script>
<script>
$(function(){
$('input[placeholder]').placeholder();
});
</script>
<![endif]-->
</head>
<style type="text/css">
input{
width: 100px;
height: 50px;
border: 1px solid red;
}
.placeholder {
color: #ccc;
}
</style>
<body>
<input type="text" placeholder="dfdsfdsfad"/>
</body>
</html>
4、注:此插件和jquery validate混合使用时,密码框password会略过校验,因为新生成的input并没有name属性。解决方法:点击提交按钮时,用js代码给新生成的input添加name属性。
让IE8和IE9支持 placeholder的更多相关文章
- 在IE8等不支持placeholder属性的浏览器中模拟placeholder效果
placeholder是一个很有用的属性,可以提示用户在input框中输入正确的内容,但是IE8以及IE8一下的浏览器不支持该属性,我们可以使用js来模拟相似的效果.下面直接上代码: <!doc ...
- 让ie8、ie9支持媒体查询
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> <!--[if lt IE 9]> <script src="https://cdn.staticfi ...
- 不同浏览器Firefox、IE6、IE7、IE8、IE9定义不同CSS样式
有时候我们在制作网页的时候,会遇到不同浏览器,对填充和边距显示的不同效果.导致心情纳闷现在提供解决这个困扰的方法! 对FF.Opear等支持Web标准的浏览器与比较顽固的IE浏览器进行针对性的CSS ...
- 让IE6、IE7、IE8、IE9、IE10、IE11支持Bootstrap的解决方法
最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了bootstrap3,在chrome,firefox,safari,opera,360浏览器(极速模式).搜狗浏览器等浏览器下均没 ...
- 让ie8支持 placeholder 属性
一. ie8支持 placeholder 属性 /* * ie8支持 placeholder 属性 */ $(function(){ if( !('placeholder' in document. ...
- 使ie8正常支持placeholder
在IE8下测试,发现一个问题placeholder不被支持,下面是解决IE支持placeholder的方法,本文引用的jquery是1.12.0测试通过,先引用jquery <script ty ...
- 让IE8支持placeholder
$(function(){ if(!placeholderSupport()){ // 判断浏览器是否支持 placeholder $('[placeholder]').focus(function( ...
- js解决IE8、9下placeholder的兼容问题
由于placeholder是html5的新属性,在IE8.IE9下是不能显示的,有兼容性问题. 解决思路: 1.判断目前浏览器是否支持placeholder属性 2.若不支持,则将type=" ...
- 区分IE8 、IE9 、IE10的专属css hack
想让IE8及以下的浏览器实现同样的效果,且不希望使用css3pie或htc或条件注释等方法时,可能就会需要用到IE8和IE9的专属css hack了. .test{ /* 1. */ color:#0 ...
随机推荐
- 非常好的一个JS代码(RelativePosition.js)
var RelativePosition = function(){ function getLeft( align, rect, rel ){ var iLeft = 0; switch (alig ...
- 使用PowerShell 自动安装.NET4.6.1离线包
自动安装脚本在文章末尾 自动安装脚本在文章末尾 自动安装脚本在文章末尾 运行环境:Windows Server 2012 R2 开发环境:Win10 Microsoft .NET Framework ...
- Laravel关联模型
public $timestamps = false;//不存时间 1.多对多关联.如收藏.用户表users,产品表products,收藏中间表user_favorite_products.那么在用户 ...
- hashmap C++实现
hashmap.h #ifndef _HASHMAP_H_ #define _HASHMAP_H_ template<class Key, class Value> class HashN ...
- PostgreSQL查询数据库中包含某种类型的表有哪些
and c.relnamespace = n.oid and nspname = 'public' and a.atttypid = t.oid and typname = 'TEXT' and c. ...
- springboot笔记-使用JSP
Spring Boot 项目中使用 JSP: 项目结构:需要添加webapp文件夹用来存放目录 jsp 文件 spring-boot-jsp +-src +- main +- java +- reso ...
- # 模乘(解决乘法取模爆long long)
模乘(解决乘法取模爆long long) 二进制思想,变乘法为多次加法,具体思想跟着代码手算一遍就理解了,挺简单的 ll qmul(ll a,ll b,ll m) { ll ans=0; while( ...
- Hive 教程(八)-hiveserver2
hive 的另外一种启动方式是 hiveserver2,它是提供了一种服务,使得我们可以远程操作 hive,就像操作 mysql 一样 hiveserver1 既然有 hiveserver2,肯定有 ...
- etcd集群安装
etcd 是一个分布式一致性k-v存储系统,可用于服务注册发现与共享配置,具有以下优点:1.简单:相比于晦涩难懂的paxos算法,etcd基于相对简单且易实现的raft算法实现一致性,并通过gRPC提 ...
- Vue的nextTick是什么?
公司做之前项目的时候,遇到了一些比较困惑的问题,后来研究明白了nextTick的用法. 我们先看两种情况: 第一种: export default { data () { return { msg: ...