HTMLDOM入力範囲ステッププロパティ
HTML DOM入力範囲ステッププロパティは、スライダーコントロールステップ属性値を設定または返すために使用されます。スライダーが各動きでどれだけ動くかを指定します。 stepプロパティでmax属性とmin属性を使用することで、有効な値の範囲を定義できます。
構文
以下は、-
の構文です。ステッププロパティの設定-
rangeObject.step=number
ここで、numberはスライダーコントロールの移動サイズを指定します。これのデフォルト値は1です。
例
入力範囲ステッププロパティの例を見てみましょう-
<!DOCTYPE html> <html> <body> <h1>Input range step Property</h1> <form> VOLUME <input type="range" id="RANGE1" name="VOL"> </form> <p>Change the step property value of the above range control by clicking the below button</p> <button type="button" onclick="changeStep()">CHANGE</button> <p id="Sample"></p> <script> function changeStep() { document.getElementById("RANGE1").step ="30" ; document.getElementById("Sample").innerHTML = "The step attribute value is now 30"; } </script> </body> </html>
出力
これにより、次の出力が生成されます-
変更ボタンをクリックすると-
上記の例では-
type =“ range”、id =“ RANGE1”、name =“ VOL”を持つフォーム内に含まれる入力フィールドを作成しました。そのステッププロパティ値はデフォルトで1-
に設定されています<form> VOLUME <input type="range" id="RANGE1" name="VOL"> <form>
次に、ユーザーがクリックしたときにchangeStep()メソッドを実行するボタンCHANGEを作成しました-
<button type="button" onclick="changeStep()">CHANGE</button>
changeStep()メソッドは、getElementById()メソッドを使用して、ID「RANGE1」を渡すことにより、タイプ範囲の入力フィールドを取得します。要素を取得した後、そのステッププロパティを30に設定します。これにより、スライダーが1回の移動で移動する量が増加します。デフォルトでは最小値が0、最大値が100であるため、スライダーは3か所にのみ移動します-
function changeStep() { document.getElementById("RANGE1").step ="30" ; document.getElementById("Sample").innerHTML = "The step attribute value is now 30"; }
-
HTMLDOM入力範囲名プロパティ
HTML DOM入力範囲名プロパティは、入力範囲フィールドの名前属性を設定または返すために使用されます。 name属性は、サーバーに送信された後のフォームデータを識別するのに役立ちます。 JavaScriptは、name属性を使用して、後で操作するためのフォーム要素を参照することもできます。 構文 以下は、-の構文です。 名前プロパティの設定- rangeObject.name = name 例 ここで、nameはレンジスライダーコントロール名を指定するためのものです。 範囲名プロパティの例を見てみましょう- <!DOCTYPE html> <html> <
-
HTMLDOM入力範囲の最小プロパティ
HTML DOM入力範囲の最小プロパティは、範囲スライダーコントロールの最小属性値を設定または返すために使用されます。この属性は、スライダーコントロールの最小値を示すために使用され、スライダーが移動できる値の範囲を作成するためにminプロパティとともに使用されることがよくあります。 構文 以下は、-の構文です。 Rangeminプロパティの設定- rangeObject.min = number ここで、数字は最小スライダー制御値を表します。 例 入力範囲の最小プロパティの例を見てみましょう- <!DOCTYPE html> <html> <bo