Wie zu testen, ob der Browser-Attribut die native Platzhalter unterstützt?

Question

Ich versuche, eine einfach zu schreiben Platzhalter jQuery-Plugin für eine Website von mir, aber natürlich möchte ich nur die Funktion feuern, wenn das native Platzhalter Attribut nicht unterstützt wird ...

Wie kann ich jQuery-Test für die native Unterstützung des Platzhalter-Attribut verwenden?

Answer 1

Sie können in den $.support ganz leicht durch das an der Spitze des Javascript Einfügen Sie ‚ve geschrieben:

jQuery.support.placeholder = (function(){
    var i = document.createElement('input');
    return 'placeholder' in i;
})();

Sie können dann entweder $.support.placeholder oder jQuery.support.placeholder verwenden überall in Ihrem Code.

NB angepasst Dieser Code von diveintohtml5 , der Link von hellvinz bereitgestellt oben.

Answer 2

Verwenden Sie die Modernizr Bibliothek, die Sie hier finden: http://www.modernizr.com/

Und dann dies tun:

if (Modernizr.input.placeholder) {
  // your placeholder text should already be visible!
} else {
  // no placeholder support :(
  // fall back to a scripted solution
}

Modernizr ist wirklich praktisch für die Prüfung der Unterstützung des Browsers für fast alle HTML5-Funktionalität.

Answer 3

ich wie mit einer solchen einfachen Klasse ...

var Browser = {
  Can: {
    Placeholder: function () {
      return 'placeholder' in document.createElement('input'); 
    }
  }
}

... so können Sie ganz einfach überprüfen, ob Ihr Browser das Attribut Platzhalter unterstützt.

if (Browser.Can.Placeholder()) {

}

Answer 4

Die placeholder Eigenschaft existiert auf INPUT DOM-Objekten in allen Browsern unabhängig davon, ob oder nicht das Platzhalter Attribut auf dem HTML-INPUT-Elemente definiert.

Der richtige Weg ist:

var Modernizr = {};
// Create the input element for various Web Forms feature tests.
var inputElem = document.createElement('input'), attrs = {};    
Modernizr.input = (function(props) {
    for(var i = 0, len = props.length; i < len; i++) {
        attrs[props[i]] = props[i] in inputElem;
    }
    return attrs;
})('autocomplete autofocus list placeholder max min multiple pattern required step'.split(' '));

if(!Modernizr.input.placeholder) {
    // Do something.
}