6

フォームにコントロールを配置する<input type="range">と、一部のブラウザーは (正しく) スライダー コントロールをレンダリングし、他のブラウザーは何rangeであるかを認識せず、代わりにテキスト ボックスをレンダリングします。テキストボックスには任意のテキストを含めることができるため、このケースを処理するには追加の検証が必要になります。「DOM でこのコントロールを見て、それがテキスト ボックス コントロールの場合は」と言うためにページに挿入できる JavaScript はありますfoo()か?

4

1 に答える 1

11

このサイトでは Modernizer の使用を推奨しています:

HTML5 の入力タイプのチェックでは、検出手法 #4 を使用します。まず、メモリ内にダミー<input>要素を作成します。すべての要素のデフォルトの入力タイプ<input>は「テキスト」です。これは非常に重要であることがわかります。

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

次に、ダミー要素の type 属性を、検出する入力タイプに設定します。

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

ブラウザがその特定の入力タイプをサポートしている場合、 type プロパティは設定した値を保持します。ブラウザがその特定の入力タイプをサポートしていない場合、設定した値は無視され、type プロパティは「テキスト」のままになります。

return i.type !== "text";

13 個の個別の関数を自分で記述する代わりに、Modernizr を使用して、HTML5 で定義されたすべての新しい入力タイプのサポートを検出できます。Modernizr は 1 つの<input>要素を再利用して、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-10T00:17:57.630 に答える