zoukankan      html  css  js  c++  java
  • IE678下placeholder效果,支持文本框和密码框

    (function($) {
      var placeholderfriend = {
        focus: function(s) {
          s = $(s).hide().prev().show().focus();
          var idValue = s.attr("id");
          if (idValue) {
            s.attr("id", idValue.replace("placeholderfriend", ""));
          }
          var clsValue = s.attr("class");
          if (clsValue) {
            s.attr("class", clsValue.replace("placeholderfriend", ""));
          }
        }
      }

      //判断是否支持placeholder
      function isPlaceholer() {
        var input = document.createElement('input');
        return "placeholder" in input;
      }
      //不支持的代码
      if (!isPlaceholer()) {
        $(function() {

          var form = $(this);
          var elements = form.find("input[type='text'][placeholder]");
          elements.each(function() {
            var s = $(this);
            var pValue = s.attr("placeholder");
              var sValue = s.val();
            if (pValue) {
              if (sValue == '') {
                s.val(pValue).css('color','#E0E0E0');
              }
            }
          });

          elements.focus(function() {
            var s = $(this);
            var pValue = s.attr("placeholder");
            var sValue = s.val();
            if (sValue && pValue) {
              if (sValue == pValue) {
                s.val('').css('color','#E0E0E0');
              }
            }
          });

          elements.blur(function() {
            var s = $(this);
            var pValue = s.attr("placeholder");
            var sValue = s.val();
            if (!sValue) {
              s.val(pValue);
            }
          });

          var element_em = form.find("input[type='email'][placeholder]");
          element_em.each(function() {
            var s = $(this);
            var pValue = s.attr("placeholder");
          var sValue = s.val();
            if (pValue) {
              if (sValue == '') {
                s.val(pValue).css('color','#E0E0E0');
              }
            }
          });

          element_em.focus(function() {
            var s = $(this);
            var pValue = s.attr("placeholder");
        var sValue = s.val();
            if (sValue && pValue) {
              if (sValue == pValue) {
                s.val('').css('color','#E0E0E0');
              }
            }
          });

          element_em.blur(function() {
            var s = $(this);
            var pValue = s.attr("placeholder");
        var sValue = s.val();
            if (!sValue) {
              s.val(pValue);
            }
          });

          var elementsPass = form.find("input[type='password'][placeholder]");
          elementsPass.each(function(i) {
            var s = $(this);
            var pValue = s.attr("placeholder");
            var sValue = s.val();
            s.val(sValue).css('color','#e0e0e0');
            if (pValue) {
              if (sValue == '') {
                var html = this.outerHTML || "";
                html = html.replace(/s*type=(['"])?password1/gi, " type=text placeholderfriend").replace(/s*(?:value|on[a-z]+|name)(=(['"])?S*1)?/gi, " ").replace(/s*placeholderfriend/, " placeholderfriend value='" + pValue + "' " + "onfocus='placeholderfriendfocus(this);' ");
                var idValue = s.attr("id");
                if (idValue) {
                  s.attr("id", idValue + "placeholderfriend");

                }
                var clsValue = s.attr("class");
                if (clsValue) {
                  s.attr("class", clsValue + "placeholderfriend");
                }
                s.hide();
                s.after(html);
              }
            }
          });

          elementsPass.blur(function() {
            var s = $(this);
            var sValue = s.val();
            if (sValue == '') {
              var idValue = s.attr("id");
              if (idValue) {
                s.attr("id", idValue + "placeholderfriend");
              }
              var clsValue = s.attr("class");
              if (clsValue) {
                s.attr("class", clsValue + "placeholderfriend");
              }
              s.hide().next().show();
            }
          });

        });
      }
      window.placeholderfriendfocus = placeholderfriend.focus;
    })(jQuery);

  • 相关阅读:
    LeetCode 252. Meeting Rooms
    LeetCode 161. One Edit Distance
    LeetCode 156. Binary Tree Upside Down
    LeetCode 173. Binary Search Tree Iterator
    LeetCode 285. Inorder Successor in BST
    LeetCode 305. Number of Islands II
    LeetCode 272. Closest Binary Search Tree Value II
    LeetCode 270. Closest Binary Search Tree Value
    LeetCode 329. Longest Increasing Path in a Matrix
    LintCode Subtree
  • 原文地址:https://www.cnblogs.com/smivico/p/5170266.html
Copyright © 2011-2022 走看看