zoukankan      html  css  js  c++  java
  • demo-placeholder兼容ie8

     模拟placeholder兼容ie8,粘贴复制代码可直接使用

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
    input {
    padding: 5px 0; /* 解决input在ie8以下的文字错乱问题 */
    color: #666;
    }
    
    #password {
    display: none;
    /* 必须 */
    }
    </style>
    </head>
    
    <body>
    <input type="text" id="username" placeholder="用户名">
    <input type="password" id="password" placeholder="密码">
    <input type="text" id="passwordText" placeholder="密码">
    
    <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script>
    
    //IE 模拟 placeholder
    $("#username").val("用户名");
    $("#passwordText").val("密码");
    textFill($("#username"));
    $("#passwordText").focus(function () {
    $(this).hide();
    $("#password").show().focus();
    });
    
    $("#password").blur(function () {
    if ($(this).val() == '') {
    $(this).hide();
    $("#passwordText").show();
    }
    });
    
    function textFill(input) {
    input.focus(function () {
    if ($.trim(input.val()) == input.attr('placeholder')) {
    input.val("");
    }
    });
    input.blur(function () {
    if ($.trim(input.val()) == "") {
    input.val(input.attr('placeholder'));
    }
    });
    }
    </script>
    </body>
    
    </html>
  • 相关阅读:
    批量转外部样式为行内样式
    AngularJS 笔记2
    windows特殊文件或文件夹
    zepto 入门
    js闭包
    AngularJS 笔记1
    sublime配置 sublimecondeintel 分号后不要提示
    sublime插件开发手记
    用flvplayer.swf在网页中播放视频(网页中flash视频播放的实现)
    无插件启动谷歌浏览器
  • 原文地址:https://www.cnblogs.com/fyj-web-18/p/9503680.html
Copyright © 2011-2022 走看看