<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title>中宏网络商学院-用户登录</title>

    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>

</head>

<script type="text/javascript">

    //判断浏览器是否支持 placeholder属性

    function isPlaceholder() {

        var input = document.createElement('input');

        return 'placeholder' in input;

    }

    $(document).ready(function () {

        if (!isPlaceholder()) {  //不支持placeholder 用jquery来完成

            var loginAccount = document.getElementById('LoginAccount').getAttributeNode('placeholder').nodeValue;

            var LoginPassword = document.getElementById('LoginPassword').getAttributeNode('placeholder').nodeValue;

            var style = document.getElementById('LoginPassword').getAttributeNode('class').nodeValue;

            $("input[id='LoginAccount']").each(//把input绑定事件 排除password框

                function () {

                    if ($(this).val() == "" && loginAccount != "") {

                        $(this).val(loginAccount);

                        $(this).focus(function () {

                            if ($(this).val() == loginAccount) $(this).val("");

                        });

                        $(this).blur(function () {

                            if ($(this).val() == "") $(this).val(loginAccount);

                        });

                    }

                });

            //对password框的特殊处理1.创建一个text框 2获取焦点和失去焦点的时候切换

            var pwdField = $("input[type=password]");

            var pwdVal = LoginPassword;

            pwdField.after('<input id="pwdPlaceholder" type="text" value=' + pwdVal + ' autocomplete="off" class="' + style + '"  tabindex = "2" />');

            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();

                }

            });

            if (document.getElementById('LoginValCode') != null) {

                var LoginValCode = document.getElementById('LoginValCode').getAttributeNode('placeholder').nodeValue;

                var style = document.getElementById('LoginValCode').getAttributeNode('class').nodeValue;

                $("input[id='LoginValCode']").each(//把input绑定事件 排除password框

                function () {

                    if ($(this).val() == "" && LoginValCode != "") {

                        $(this).val(LoginValCode);

                        $(this).focus(function () {

                            if ($(this).val() == LoginValCode) $(this).val("");

                        });

                        $(this).blur(function () {

                            if ($(this).val() == "") $(this).val(LoginValCode);

                        });

                    }

                });

            }

        }

    });  

</script>

<body>

<div class="wrap-full">

    <div class="block-box block-box-1 mt-45">

        <div class="block-body">

            <div class="block-cont">

                <div class="block-tit rel"><span class="ico abs"></span>用户登录</div>

                <div class="clear">

                    <div class="w-4 mtb100 br fl">

                        <ul class="list-login">

                            <li><span class="ico ico-1"></span> <input type="text" class="ipt" id="LoginAccount" placeholder="请输入身份证号码"></li>

                            <li><span class="ico ico-2"></span> <input type="password" class="ipt" id="LoginPassword" placeholder="请输入密码"></li>

                            <li class="clear"><span class="ico ico-3"></span> <input type="text" class="ipt ipt-s fl" id="LoginValCode" placeholder="请输入验证码"><span class="code fr"><img src="data:images/code.jpg" alt=" "></span></li>

                            <li><button type="button" class="btn">立即登录</button></li>

                        </ul>

                    </div>

                </div>

            </div>

        </div>

    </div>

</div>

</body>

</html>

解决IE8placeholder属性问题的更多相关文章

  1. VS 错误解决(项目-属性-启用调试器)

    我是先安装了VS2012, 之后由于需要安装了VS2008, 但在VS2012中可以运行程序但是不能调试, 即按Ctrl+F5可以运行, 但是按F5会提示错误. "尝试运行项目时出错:Unc ...

  2. BootstrapValidator 解决多属性被同时校验问题

    问题描述:在使用bootstrapValidator插件校验表单属性,当表单属性过多需要每行并列多个属性 ,会出现校验第一个属性,发现整行被校验的效果 ,这不是我们工作想要的效果.如图: 问题分析:因 ...

  3. Java使用序列化的私有方法巧妙解决部分属性持久化问题

    部分属性持久化问题看似很简单,只要把不需要的持久化的属性加上瞬态关键字(transient关键字)即可,没错,这也是一种解决方案,但在有的时候行不通,例如在一个计税系统和人力系统对接的时候,计税系统需 ...

  4. 解决opacity属性在低版本IE浏览器下失效的方法

    以前,一直都以为ie9以下的版本不支持opacity属性.所以就同时使用 opacity和ie独特的filter蒙版.但是有些时候需要一些动态的效果,就比如层的渐渐消失,隐藏,就需要使用动态变化的op ...

  5. 周记3——解决fixed属性在ios软键盘弹出后失效的bug

    这周在做空间(“类似”qq空间)项目.首页是好友发表的说说,可以针对每条说说进行评论,评论框吸附固定在屏幕底部.此时,Bug来了...在ios上,软键盘弹出后fixed属性失效了.后来发现,ios绝大 ...

  6. BootstrapValidator 解决多属性被同时校验问题《转》

    问题描述:在使用bootstrapValidator插件校验表单属性,当表单属性过多需要每行并列多个属性 ,会出现校验第一个属性,发现整行被校验的效果 ,这不是我们工作想要的效果.如图: 问题分析:因 ...

  7. 如何解决Css属性text-overflow:ellipsis 不起作用(文本溢出显示省略号)

    如何使text-overflow:elipsis起作用? 想要使用css属性text-overflow:elipsis起到作用,样式必须跟overflow:hidden; white-space:no ...

  8. 解决inline-block属性带来的标签间间隙问题

    1.给inline-block元素设置一个父元素. 设置父元素的font-size:0:.子元素font-size设置成合适大小,如果不设置子元素font-size,子元素会继承父元素的0: 2.给i ...

  9. iOS开发解决 jsonModel 属性跟系统的重复

    -(id)initWithDic:(NSDictionary *)dic { if (self = [super init]) { [self setValuesForKeysWithDictiona ...

随机推荐

  1. Linux性能测试 ss命令

    ss即socket state,也就是说,是可以查看系统中socket的状态的.我们可以用netstat,但为什么还要用ss这个工具呢,当然ss也是有好处的.当我们打开的socket数量很多时,net ...

  2. [WebGL入门]十一，着色器编译器和连接器

    注意:文章翻译http://wgld.org/,原作者杉本雅広(doxas).文章中假设有我的额外说明.我会加上［lufy:］.另外.鄙人webgl研究还不够深入.一些专业词语,假设翻译有误.欢迎大家 ...

  3. objective-c启用ARC时的内存管理

    PDF版下载:http://download.csdn.net/detail/cuibo1123/7443125      在objective-c中,内存的引用计数一直是一个让人比較头疼的问题.尤其 ...

  4. matlab 三维图像的绘制

    1. 基本绘图函数 plot3() scatter3() 2. 修饰与点缀 但仅使用默认的配置,调用这些绘图函数,不会很丑,但也漂亮不到哪里去. view(az, el),调整视野和视角:

  5. python3下的IE自动化模块PAMIE

    PAMIE是Python下面的用于IE的自动化模块,支持python2和python3,python3的下载地址:http://sourceforge.net/projects/pamie/files ...

  6. ASP.NET Core 简介 - ASP.NET Core 基础教程 - 简单教程，简单编程

    原文:ASP.NET Core 简介 - ASP.NET Core 基础教程 - 简单教程,简单编程 ← ASP.NET Core 基础教程 ASP.NET Core Windows 环境配置 → A ...

  7. WPF 窗体中获取键盘和鼠标无操作时的超时提示

    原文:WPF 窗体中获取键盘和鼠标无操作时的超时提示 通过调用Windows API中的GetLastInputInfo来获取最后一次输入的时间 , , );            timer.Tic ...

  8. 操作系统hosts文件

    为了便于北京和大连两个更好的测试系统.该公司专门申请一个域名:大连r \\ u0026 D侧只需要部署(我方系统全权负责在大连研发.所以在大连并列比较的部署方面easy--不要忘记,该项目比我们实际做 ...

  9. Swift 开源那点事儿

    最近各大网站上最喜大普奔的新闻莫过于 Swift 正式开源这条了.这无疑是一个里程碑式的前进,苹果也向开源社区更加进了一步.那么 Swift 开源后有什么具体的改变呢,我们一一道来. 成立开源社区 s ...

  10. sql in(inner join)

    查看执行任务可知,使用in关键字,会进行inner join,找出匹配项