如何檢測是否支持HTML5輸入控件？

如果我在窗體上放置了一個<input type="range">控件，某些瀏覽器將（正確）呈現滑塊控件，而其他瀏覽器則不知道range是否會呈現文本框。處理這種情況需要額外的驗證，因爲文本框可以包含任何文本。有沒有JavaScript可以放入頁面來說「在DOM中查看此控件，如果它是文本框控件，請執行foo()」？如何檢測是否支持HTML5輸入控件？

來源

2013-04-10 Mason Wheeler

可能重複[如何檢查，如果輸入的HTML5支持？（http://stackoverflow.com/questions/8278670/how-to-check-if-a-html5-input-is - 支持） – Mathletics 2013-04-10 00:20:11

這site recommends using Modernizer：

檢查HTML5輸入類型使用檢測技術＃4。首先，在內存中創建一個虛擬<input>元素。所有<input>元素的默認輸入類型都是「文本」。這將被證明是非常重要的。

var i = document.createElement("input");

接下來，將啞元素上的type屬性設置爲要檢測的輸入類型。

i.setAttribute("type", "color");

如果您的瀏覽器支持該特定輸入類型，則type屬性將保留您設置的值。如果您的瀏覽器不支持該特定輸入類型，它將忽略您設置的值，並且類型屬性仍然是「文本」。

return i.type !== "text";

，而不是寫13個獨立的功能你自己，你可以使用Modernizr的檢測所有在HTML5中定義的新的輸入類型的支持。 Modernizr重用了單個元素來有效檢測對所有13種輸入類型的支持。然後它構建一個名爲Modernizr.inputtypes的散列，其中包含13個鍵（HTML5類型屬性）和13個布爾值（如果支持則爲true，否則爲false）。

//check for native date picker 
if (!Modernizr.inputtypes.date) { 
    // no native support for <input type="date"> :(
    // maybe build one yourself with Dojo or jQueryUI 
}

的

來源

2013-04-10 00:17:57

檢查出HTML 5 shim ...也與錯誤的HTML 5 shiv。 – ErikE 2013-04-10 00:20:18

如何檢測是否支持HTML5輸入控件？

回答

相關問題