IE8 placeholder兼容+Password兼容
对于placeholder兼容问题 IE系列的大部分不兼容
使用JQ插件解决这个问题,确实用法很简单
jS下载地址http://www.ijquery.cn/js/jquery.placeholder.min.js
<script type="text/javascript" src="http://www.ijquery.cn/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://www.ijquery.cn/js/jquery.placeholder.min.js"></script>
<script type="text/javascript">
$(function(){ $('input, textarea').placeholder(); });
</script>
后续,placeholder引发的一系列问题
谨慎:早期的placeholder.min.js可能对Password输入框不支持,
很多人都困惑对Password的解决办法,下面分享一些利用placeholder.min.js+validate.js的一套验证demo
<script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/Jquery.validate.expand.js"></script>
<script src="~/Scripts/jquery.placeholder.min.js"></script>
$("#Form").validate({
ignore: "",
rules: {
Name: { required: true, rangelength: [4, 20],chrnum: true,CheckUserName:true },
Password: { required: true, rangelength: [4,20] },
Newpassword: { equalTo: '#Password',rangelength: [4,20] },
Mobile: { required: true,rangelength: [5, 15],digits:true,CheckPhone:true },
check: { required: true}
},
messages: {
Name: { required: "账号名称不能为空", rangelength: "请输入4-20个字母、数字组合",chrnum:"请输入4-20个字母、数字组合",CheckUserName:"该账号已被注册" },
Password: { required: "密码不能为空", rangelength: "请输入4-20个字" },
Newpassword: { equalTo: "两次密码输入不一致",rangelength: "请输入4-20个字" },
Mobile: { required: "请输入联系电话",rangelength:"请输入5-15个字",digits:"请输入有效数字",CheckPhone:"该联系号码已被使用" },
check: {required:"请选择复选框"}
},
//对radio或checkbox的扩展
errorPlacement: function (error, element) { //指定错误信息位置
if (element.is(':checkbox')) { //如果是radio或checkbox
var eid = element.attr('name'); //获取元素的name属性
error.appendTo(element.parent()); //将错误信息添加当前元素的父结点后面
} else {
error.insertAfter(element);
}
},
submitHandler: function (form) {
//ajax请求后台数据
}
})
IE8 placeholder兼容+Password兼容的更多相关文章
- 记录:asp.net mvc 中 使用 jquery 实现html5 实现placeholder 密码框 提示兼容password IE6
@{ViewBag.Title = "完美结合";} <script>var G_start_time = new Date;</script> <! ...
- jquery html5 实现placeholder 兼容password ie6
<style type="text/css"> /* 设置提示文字颜色 */ ::-webkit-input-placeholder { color: #838383; ...
- 强制将IE8设置为IE7兼容模式来解析网页
强制将IE8设置为IE7兼容模式来解析网页 英文原文:http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx 文件兼容性用于定义让IE ...
- UI设计文本框解决Placeholder的在IE10 以下 IE 9 IE8 IE 7 的兼容问题
创建JS文件 placeholderfriend.js (function($) { /** * 牛叉的解决方案 */ var placeholderfriend = { focus: functio ...
- ie8中遇到的兼容问题以及解决方案
一.CSS3 1.可以通过在css中引入pie.htc,处理兼容问题(可处理的属性) -webkit-box-shadow: 0 1px 5px #ff2826; -webkit-border-rad ...
- input输入框的border-radius属性在IE8下的完美兼容
在工作中我们发现搜索框大部分都是有圆角的,为此作为经验不足的前端人员很容易就想到,给input标签添加border-radius属性不就解决了嘛.不错方法确实是这样,但是不要忘了border-radi ...
- ie8中支持 password 的 placeholder
之前写过一篇 ie8中使用placeholder 的博客,但是,该文中的 placeholder 在 type="password" 时会出现问题,不能显示文字而是密码类型的点,所 ...
- IE8一枝独秀的JS兼容BUG
// 例如淡入淡出的封装类文件 function ImagesEff(div,time){ this.arr=[];//装载所有div this.time=time; this.recordOld=n ...
- placeholder各种浏览器兼容问题
只要在页面上引入placeholder.min文件,再以$('input,textarea').placeholder(); 就可以兼容ie等各种浏览器. placeholder.min.js文件链接 ...
随机推荐
- WPF会重写Windows GUI的历史吗?
原文地址:http://tech.it168.com/zx/2007-09-15/200709141320653.shtml 你可能对微软的.NET框架3.0版本的最近的一次更新感到有点奇怪.主版本指 ...
- BZOJ 1016 最小生成树计数
Description 现在给出了一个简单无向加权图.你不满足于求出这个图的最小生成树,而希望知道这个图中有多少个不同的最小生成树.(如果两颗最小生成树中至少有一条边不同,则这两个最小生成树就是不同的 ...
- [BZOJ 2350] [Poi2011] Party 【Special】
题目链接: BZOJ - 2350 题目分析 因为存在一个 2/3 n 大小的团,所以不在这个团中的点最多 1/3 n 个. 牺牲一些团内的点,每次让一个团内的点与一个不在团内的点抵消删除,最多牺牲 ...
- Android 5.0 技术新趋势
由于 Android 的版本分裂比较严重,整个新系统升级可能需要一两年甚至更长时间.所以目前使用 Android 5.0 的大部分是喜欢尝鲜的用户,同时现在市场上能够很好支持 Android 5.0 ...
- Yaroslav and Sequence
Codeforces Round #182 (Div. 1) A:http://codeforces.com/contest/301/problem/A 题意:给你2*n-1个数,你每次可以选择n个连 ...
- 通过 IDE 向 Storm 集群远程提交 topology
转载: http://weyo.me/pages/techs/storm-topology-remote-submission/ http://www.javaworld.com/article/20 ...
- Python4Delphi也是与VCL密切相关,所以才能相互调用,绝对有研究价值!
Python4Delphi也是与VCL密切相关,所以才能相互调用,绝对有研究价值! http://www.cnblogs.com/GarfieldTom/archive/2013/01/17/2864 ...
- PlatformTransactionManager
Spring Boot 使用事务非常简单,首先使用注解 @EnableTransactionManagement 开启事务支持后,然后在访问数据库的Service方法上添加注解 @Transactio ...
- Linux kernel ‘ip6_sk_dst_check’函数拒绝服务漏洞
漏洞名称: Linux kernel ‘ip6_sk_dst_check’函数拒绝服务漏洞 CNNVD编号: CNNVD-201307-070 发布时间: 2013-07-05 更新时间: 2013- ...
- UVAlive3415 Guardian of Decency(最大独立集)
题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=34831 [思路] 二分图的最大独立集. 即在二分图中选取最多的点, ...