HTMLDOM入力範囲値プロパティ
HTML DOM入力範囲valueプロパティは、type =” range”を持つinput要素とvalue属性に関連付けられています。スライダー制御値属性の値を返す、または設定するために使用します。 value属性は、デフォルト値またはスライダーをドラッグして設定された値にすることができます。
構文
以下は、-
の構文です。値プロパティの設定-
rangeObject.value = text;
ここでは、テキストは範囲スライダーコントロールの値を指定するために使用されます。
例
入力範囲値プロパティの例を見てみましょう-
<!DOCTYPE html> <html> <body> <h1>Input range Value property</h1> <form> VOLUME <input type="range" id="RANGE1" name="VOL"> </form> <p>Get the above element value by clicking the below button</p> <button onclick="getValue()">Get Value</button> <p id="Sample"></p> <script> function getValue() { var t = document.getElementById("RANGE1").value; document.getElementById("Sample").innerHTML = "The value for the radio button is : "+t; } </script> </body> </html>
出力
これにより、次の出力が生成されます-
「値を取得」ボタンをクリックすると-
上記の例では-
type =“ range”、id =“ RANGE1”、name =“ VOL” −
を持つフォーム内に含まれる入力フィールドを作成しました<form> VOLUME <input type="range" id="RANGE1" name="VOL"> <form>
次に、ユーザーがクリックしたときにgetValue()メソッドを実行する「GetValue」ボタンを作成しました-
<button type="button" onclick="getValue()">Get Value</button>
getValue()メソッドは、getElementById()メソッドを使用して入力要素を取得し、その「value」属性値を変数tに割り当てます。この変数は、innerHTMLプロパティ-
を使用して、IDが「Sample」の段落に表示されます。function getValue() { var t = document.getElementById(“RANGE1").value; document.getElementById("Sample").innerHTML = "The value for the input field is : "+t; }>
-
HTMLDOM入力範囲無効プロパティ
HTML DOM入力範囲無効プロパティは、範囲スライダーを無効にするかどうかを設定または返すために使用されます。ブール値を使用します。trueは範囲スライダーを無効にする必要があり、それ以外の場合はfalseを表します。デフォルトでは、disabledプロパティはfalseに設定されています。ただし、無効になっている要素はデフォルトでグレー表示され、クリックできません。 構文 以下は、-の構文です。 無効なプロパティの設定- rangeObject.disabled = true|false; ここで、true =範囲スライダーは無効であり、false=範囲スライダーは無効ではありません
-
HTMLDOM入力範囲のオートフォーカスプロパティ
HTML DOM入力範囲のautofocusプロパティは、HTMLの要素のautofocus属性に関連付けられています。このプロパティは、ページが読み込まれたときに入力範囲スライダーが自動的にフォーカスされるかどうかを設定または返すために使用されます。 構文 以下は、-の構文です。 オートフォーカスプロパティの設定- rangeObject.autofocus = true|false ここで、trueは範囲スライダーがフォーカスを取得する必要があることを表し、falseはそうでないことを表します。デフォルトではfalseに設定されています。 例 入力範囲のオートフォーカスプロパティの