Teilen Sie das JQuery-Plug-in, das Platzhaltereffekte für Textfelder und Kennwortfelder unterstützt, unter IE_jquery

Ich habe dieses Plug-in vor langer Zeit geschrieben. Es basiert auf jQuery und wird hauptsächlich zur Implementierung von Platzhaltereffekten im IE verwendet. Es unterstützt sowohl Text- als auch Passworteingabefelder.

Platzhalter ist ein neues Attribut in HTML5. Wenn das Eingabeattribut festgelegt ist, wird der Inhalt des Werts im Textfeld als graue Eingabeaufforderung angezeigt. Wenn das Textfeld den Fokus erhält, verschwindet der Eingabeaufforderungstext.

Download-Adresse: http://xiazai.jb51.net/201501/other/placeholderfriend.rar

Der Implementierungscode lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

(Funktion($) {
/**
* Bäume ohne Blumen
* 28.11.2012 15:12
​*/

var placeholderfriend = {
Fokus: Funktion(en) {
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", ""));
}
}
}

//Bestimmen Sie, ob Platzhalter unterstützt werden
Funktion isPlaceholer() {
var input = document.createElement('input');
Geben Sie „Platzhalter“ in der Eingabe zurück;
}
//Nicht unterstützter Code
if (!isPlaceholer()) {
$(function() {

var form = $(this);

//Alle Textfelder durchlaufen und Platzhalter-Simulationsereignisse hinzufügen
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);
          }
}
});

elements.focus(function() {
        var s = $(this);
      var pValue = s.attr("placeholder");
var sValue = s.val();
If (sValue && pValue) {
If (sValue == pValue) {
          s.val('');
          }
}
});

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

//Durchsuchen Sie alle Passwortfelder und fügen Sie Platzhaltersimulationsereignisse hinzu
var elementsPass = form.find("input[type='password'][placeholder]");
       elementsPass.each(function(i) {
        var s = $(this);
      var pValue = s.attr("placeholder");
var sValue = s.val();
If (pValue) {
                if (sValue == '') {
//DOM unterstützt keine Typänderung. Sie müssen die Passwortfeldattribute kopieren und ein neues DOM generieren
               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);

Es ist sehr einfach zu verwenden, das Beispiel ist wie folgt:

Code kopieren Der Code lautet wie folgt: