记录：asp.net mvc 中 使用 jquery 实现html5 实现placeholder 密码框 提示兼容password IE6
@{ViewBag.Title = "完美结合";}
<script>var G_start_time = new Date;</script>
<!--[if (lt IE 8.0)]><link type="text/css" rel="stylesheet" href="@Url.Content("~/Content/login/css/index.src_datauri.css")"><![endif]--><!--[if (!IE)|(gte IE 8.0)]><!--><link type="text/css" rel="stylesheet" href="@Url.Content("~/Content/login/css/index.src_datauri.css")"><!--<![endif]-->
<script type="text/javascript" src="@Url.Content("~/Content/login/js/jquery-1.4.2.min.js")"></script>
<style type="text/css">
<!--
body {
background-color: #f0f0f0;
}
-->
#loginSubmit .submit input:hover{background-color:#26B30F}；
#login .submit input:hover{background-position:0 -69px}；
#loginSubmit .submit input:hover{background-position:0 -69px}；
/* 设置提示文字颜色 */
::-webkit-input-placeholder {
color: #838383;
}
:-moz-placeholder {
color: #838383;
}
.placeholder {
color: #ccc;
}
</style>
<script type="text/javascript">
//判断浏览器是否支持 placeholder属性
function isPlaceholder(){
var input = document.createElement('input');
return 'placeholder' in input;
}
if (!isPlaceholder()) {//不支持placeholder 用jquery来完成
$(document).ready(function() {
if(!isPlaceholder()){
$("input").not("input[type='password']").each(//把input绑定事件 排除password框
function(){
if($(this).val()=="" && $(this).attr("placeholder")!=""){
$(this).val($(this).attr("placeholder"));
$(this).focus(function(){
if($(this).val()==$(this).attr("placeholder")) $(this).val("");
});
$(this).blur(function(){
if($(this).val()=="") $(this).val($(this).attr("placeholder"));
});
}
});
//对password框的特殊处理1.创建一个text框 2获取焦点和失去焦点的时候切换
var pwdField = $("input[type=password]");
var pwdVal = pwdField.attr('placeholder');
pwdField.after('<input id="pwdPlaceholder" type="text" value='+pwdVal+' class="ipt tipinput1" autocomplete="off" />');
var pwdPlaceholder = $('#pwdPlaceholder');
pwdPlaceholder.show();
pwdField.hide();
pwdPlaceholder.focus(function(){
pwdPlaceholder.hide();
pwdField.show();
pwdField.focus();
});
pwdField.blur(function(){
if(pwdField.val() == '') {
pwdPlaceholder.show();
pwdField.hide();
}
});
}
});
}
</script>
</head>
<body >
<script>if(top !== self){
top.location = location.href;
}
var startTime = new Date(),
loginInitTime;</script>
<div class="slide-wrap">
<div class="container">
<div class="slide-box">
<div class="slide"></div>
</div>
<div class="slide-point-box">
<span class="cur-point" data-index="0">@ViewData["msg"]</span>
<span data-index="1" style="color:red;"></span></div>
<div class="login-panel" >
<form name="form1" id="form1" method="post" action="@Url.Action("SignIn")">
<h1>预录助手网页版登录</h1>
<div id="login"><div id="modLoginWrap" class="mod-qiuser-pop"><iframe style="display:none" name="loginiframe"></iframe>
<form id="loginForm" method="post" target="loginiframe" onSubmit="QHPass.loginUtils.submit();return false;">
<dl class="login-wrap"><dt>
<span id="loginTitle">
</span>
<div id="infobarNoCookie" class="noCookie">浏览器已禁止设置cookie，无法正常登录，请<a href="" target="_blank"> 启用cookie </a>?</div>
</dt>
<dd class="global-tips">
<div id="error_tips" class="" >@ViewData["msg"]</div></dd><!--登录错误提示 -->
<dd><div class="quc-clearfix login-item">
<label for="loginAccount">帐号</label>
<span class="input-bg">
<input name="userName" id="userName" type="text" class="ipt tipinput1" size="20" placeholder="请输入用户名" value="@Model.name" /></span>
<b class="tips-wrong icon-loginAccount"></b>
<span id="tips-loginAccount" class="tips-msg "></span>
</div>
</dd>
<dd class="password">
<div class="quc-clearfix login-item">
<label for="lpassword">密码</label>
<span class="input-bg">
<input name="password" id="password" type="password" class="ipt tipinput1" size="20" placeholder="请输入密码" value="@Model.password" />
</span>
<b class="tips-wrong icon-lpassword"></b>
<span id="tips-lpassword" class="tips-msg">
</span></div></dd>
<!--记住密码 -->
<dd class="find"><label for="iskeepalive"><input type="checkbox" name="isSavePWD" value="1" @(Model.isSavePWD == "1" ? "checked " : " ") /> 记住密码</label><a href="http://i." target="_blank" class="fac" id="findPwd">忘记密码？</a></dd>
<!--记住密码 -->
<dd class="submit"><span><a class="input_btn" href="javascript:form1.submit();">登录</a></span></dd>
<div class="change">
</form>
</div>
</div>
</div>
</div>
</body>
</html>
参考网址：
http://myfreespace.iteye.com/blog/1659450
http://kongcodecenter.iteye.com/blog/1305551
http://blog.163.com/front_end1205/blog/static/2143711382013101154419375/
http://blog.csdn.net/dyllove98/article/details/8860447
http://blog.csdn.net/trace332/article/details/6424444
https://github.com/jamesallardice/Placeholders.js/issues
http://lidrema.blog.163.com/blog/static/209702148201305101844932/
http://www.2cto.com/kf/201308/239953.html
http://blog.csdn.net/cui_angel/article/details/7790377
记录：asp.net mvc 中 使用 jquery 实现html5 实现placeholder 密码框 提示兼容password IE6的更多相关文章
- asp.net mvc中使用jquery H5省市县三级地区选择控件
地区选择是项目开发中常用的操作,本文讲的控件是在手机端使用的选择控件,不仅可以用于实现地区选择,只要是3个级别的选择都可以实现,比如专业选择.行业选择.职位选择等.效果如下图所示: 附:本实例asp. ...
- 在ASP.NET MVC中使用jQuery的Load方法加载静态页面的一个注意点
使用使用jQuery的Load方法可以加载静态页面,本篇就在ASP.NET MVC下实现. Model先行: public class Article { public int Id { get; s ...
- 在ASP.NET MVC中使用typeahead.js支持预先输入,即智能提示
使用typeahead.js可以实现预先输入,即智能提示,本篇在ASP.NET MVC下实现.实现效果如下: 首先是有关城市的模型. public class City { public int Id ...
- ASP.NET MVC中使用jQuery时的浏览器缓存问题
介绍 尽管jQuery在浏览器ajax调用的时候对缓存提供了很好的支持,还是有必要了解一下如何高效地使用http协议. 首先要做的事情是在服务器端支持HTTP GET,定义不同的URL输出不同的数据( ...
- ASP.NET MVC 中使用 jQuery 实现异步搜索功能
常见的几种异步请求方式: Ajax.BeginForm 异步提交文本的形式 Ajax.ActionLinkk 文本链接的形式 Client Validataion 客户端的认证 一.用jQuer ...
- ASP.NET MVC中jQuery与angularjs混合应用传参并绑定数据
要求是这样子的,在一个列表页中,用户点击详细铵钮,带记录的主键值至另一页.在另一外页中,获取记录数据,然后显示此记录数据在网页上. 先用动图演示: 昨天有分享为ng-click传递参数 <ang ...
- ASP.NET MVC中Log4Net记录错误日志的使用
第一.在管理NuGet程序包 =>下载 Log4Net 第二.在web.config配置Log4Net 1:在<configuration>节点下 <configSection ...
- 《Entity Framework 6 Recipes》中文翻译系列 (20) -----第四章 ASP.NET MVC中使用实体框架之在MVC中构建一个CRUD示例
翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 第四章 ASP.NET MVC中使用实体框架 ASP.NET是一个免费的Web框架 ...
- 在ASP.NET MVC中以post方式传递数组参数的示例
最近在工作中用到了在ASP.NET MVC中以post方式传递数组参数的情况,记录下来,以供参考. 一.准备参数对象 在本例中,我会传递两个数组参数:一个字符串数组,一个自定义对象数组.这个自定义对象 ...
随机推荐
- 未来十年的十三条思考（FW）
支付宝在某种意义上延续了“双十一”的购物狂欢. 如果你关注微信朋友圈,你会发现支付宝最近以各种广告.方案植入方式推出强劲广告.而其中很重要的一个促销手段便是,从今年12月1日到12月15日,用户在一些 ...
- 洛谷P1827 美国血统 American Heritage
P1827 美国血统 American Heritage 54通过 90提交 题目提供者JOHNKRAM 标签USACO 难度普及- 提交 讨论 题解 最新讨论 暂时没有讨论 题目描述 农夫约翰非 ...
- jquery递归遍历xml文件，形成ul-li序列，生成树结构(使用了treeview插件)
treeview插件从这里获得,下载的文件中有demo,看demo文件夹里面的index.html文件就差不多知道如何使用该控件了,在我做的项目里用到的部分代码截图如下(在引用下面的js文件前要先引用 ...
- python os模块sys模块常用方法
官方文档看这里 https://docs.python.org/3.5/library/os.html http://www.cnblogs.com/wupeiqi/articles/5501365. ...
- 【Framework】HTTP运行期与页面执行模型
HTTP运行期 HTTP运行期处理客户端应用程序(例如Web浏览器)进入的一个Web请求,通过处理它的应用程序的适当组件路由请求,然后产生响应并发回提出请求的客户端应用程序. 进入的HTTP Web请 ...
- Linux 命令之 grep
1:将/etc/passwd中有root字符的行显示出来 [root@bogon zkero]# grep -n 'root' /etc/passwd :root:x:::root:/root:/bi ...
- mac ping ip地址
Mac下有个类似于Windows下CMD的模式叫做终端,但是这个模式和Windows下的CMD有着很大的差别. 工具/原料 Mac电脑一台 方法/步骤 首先通过菜单栏的搜索功能找到“终端”,也可以 ...
- 【风马一族_mysql】MySQL免安装版环境配置图文教程
mysql存放在某一个磁盘中(笔者使用E盘) 配置系统变量 打开 电脑的属性 点击 高级系统设置 选择 高级 点击 环境变量 选择 系统变量 点击 变量Path,追加 值 E:\mysql-5.6.2 ...
- c/c++基本问题
1. 使用g++将文件编译成库文件 g++ -c -O2 -fPIC test.cpp -o test.o && g++ -shared -Wall -o test.so test.o ...
- CentOS学习笔记--Tomcat安装
Tomcat安装 通常情况下我们要配置Tomcat是很容易的一件事情,但是如果您要架设多用户多服务的Java虚拟主机就不那么容易了.其中最大的一个问题就是Tomcat执行权限.普通方式配置的Tomca ...