How to check if a browser supports <input type=“time” />

Question

Is there a way in HTML, javascript, or Razor to detect if the browser supports <input type="time" /> elements?

Thanks in advance.

Answer 1

Invalid values will be rejected when assigned to the .type property of an input element.

try {
    var input = document.createElement("input");

    input.type = "time";

    if (input.type === "time") {
        console.log("supported");
    } else {
        console.log("not supported");
    }
} catch(e) {
    console.log("not supported");
}

If there's some browser issue I'm not aware of, then using .innerHTML should do the same.

var div = document.createElement("div");
div.innerHTML = "<input type='time'>";

if (div.firstChild.type === "time")
    console.log("supported");
else
    console.log("not supported");

Answer 2

I think your best option would be to check the browser support and code the usage programmatically.

http://caniuse.com/input-datetime