Simple way to check if placeholder is supported?

Solution 1:

function placeholderIsSupported() {
    var test = document.createElement('input');
    return ('placeholder' in test);
}

I used a jQuery-ized version as a starting point. (Just giving credit where it's due.)

Solution 2:

Or just:

if (document.createElement("input").placeholder == undefined) {
    // Placeholder is not supported
}

Solution 3:

Another way without making an input element in memory that has to be GC'd:

if ('placeholder' in HTMLInputElement.prototype) {
    ...
}

Solution 4:

If you are using Modernizr, quick catch following:

if(!Modernizr.input.placeholder){
  ...
}

Solution 5:

http://html5tutorial.info/html5-placeholder.php has the code to do it.

If you're already using jQuery, you don't really need to do this though. There are placeholder plugins available ( http://plugins.jquery.com/plugin-tags/placeholder ) that will use the HTML5 attribute where possible, and Javascript to simulate it if not.