いくつかの入力要素にはsetSelectionRangeプロパティがあり、実際にサポートされているかどうかをテストする方法は何ですか？

Question

私はsetSelectionRangeプロパティのチェックボックスをテストするのに使用していたと確信しています。しかし、それはいくつかのブラウザ（テストされたFirefoxとChrome）で変更されたようです。

私はこのような選択を行う前にsetSelectionRangeプロパティのチェックを行うために使用：

if (el.setSelectionRange) { 
    el.setSelectionRange(0, 9999); 
} 

ただし、チェックボックスは、これはエラーをスローsetSelectionRange性質を持っているように見えるからです。

どのようにして選択を行うことができるかどうかは今どのようにテストするのですか？

https://jsfiddle.net/kb2ad5b5/

いくつかの背景

テストはこれを行うことができる任意の要素で範囲を選択し、親のデリゲートイベントリスナーである：ここでは

もフィドルです。

Answer 1

で定義されているため、すべての入力はチェックボックスであっても継承されているため、setSelectionRangeがあります。

しかし、もちろんsetSelectionRangeのような場合には、それはスロー、すべての入力には適用されません：input要素については

を、同時に彼らはdon't applyこれらのメソッドを呼び出すと、彼らdon't apply、 が投げなければならないが、これらの属性を設定します"InvalidStateError"DOMException; これらの属性を取得中は、don't applyはnullを返す必要があります。 それ以外の場合は、以下のように動作する必要があります。

それだけText, Search、URL、TelephoneとPassword入力に適用されます。

だから、あなたはまた

if (["text", "search", "url", "tel", "password"].indexOf(input.type) >= 0) { 
    input.setSelectionRange(start, end); 
} 

ような何かを行うことができ、あなたはtry-catchステートメントを使用することができます。それはHTMLInputElement要素のインターフェイスのために定義されているため

try { 
    input.setSelectionRange(start, end); 
} catch(err) { 
    if (err instanceof DOMException && err.name === "InvalidStateError") { 
    // setSelectionRange does not apply 
    } else { 
    throw err; 
    } 
} 

Answer 2

チェックボックスがsetSelectionRange()方法があります。

interface HTMLInputElement : HTMLElement { 
    ... 
    void setSelectionRange(unsigned long start, unsigned long end, optional DOMString direction); 
} 

フォーム上のHTML5のW3C仕様を参照してください：input要素がサポートされている入力タイプのホワイトリストを維持することができsetSelectionRange()への呼び出しをサポートして確保するためにhttps://www.w3.org/TR/html5/forms.html

を。だから、/(text|password)/.test(el.type)をチェックすることができます。