HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLDOM入力範囲のオートフォーカスプロパティ


HTML DOM入力範囲のautofocusプロパティは、HTMLの要素のautofocus属性に関連付けられています。このプロパティは、ページが読み込まれたときに入力範囲スライダーが自動的にフォーカスされるかどうかを設定または返すために使用されます。

構文

以下は、-

の構文です。

オートフォーカスプロパティの設定-

rangeObject.autofocus = true|false

ここで、trueは範囲スライダーがフォーカスを取得する必要があることを表し、falseはそうでないことを表します。デフォルトではfalseに設定されています。

入力範囲のオートフォーカスプロパティの例を見てみましょう-

<!DOCTYPE html>
<html>
<body>
<h1>Input range autofocus property</h1>
<form>
<input type="range" id="RANGE1" name="VOL" autofocus>
</form>
<br>
<button type=”button” onclick="rangeFocus()">CHECK</button>
<p id="Sample"></p>
<script>
   function rangeFocus() {
      var R = document.getElementById("RANGE1").autofocus;
      document.getElementById("Sample").innerHTML = "The autofocus property is set to: "+R;
   }
</script>
</body>
</html>

出力

これにより、次の出力が生成されます-

HTMLDOM入力範囲のオートフォーカスプロパティ

チェックボタンをクリックすると-

HTMLDOM入力範囲のオートフォーカスプロパティ

上記の例では-

type =“ range”、id =“ RANGE1”、name =“ VOL”のフォーム内に含まれる入力フィールドを作成し、オートフォーカスプロパティを有効にしました。つまりtrueに設定しました。

<form>
<input type="range" id="RANGE1" name="VOL" autofocus>
</form>

次に、ユーザーがクリックしたときにrangeFocus()メソッドを実行するボタンCHECKを作成しました-

<button type=”button” onclick="rangeFocus()">CHECK</button>

rangeFocus()メソッドは、getElementById()メソッドを使用して範囲タイプの入力要素を取得し、autofocusプロパティを取得します。 autofocusプロパティは、範囲スライダーのautofocus属性値に応じてtrueとfalseを返します。この値は変数Rに割り当てられ、innerHTMLプロパティ-

を使用して、IDが「Sample」の段落に表示されます。
function rangeFocus() {
   var R = document.getElementById("RANGE1").autofocus;
   document.getElementById("Sample").innerHTML = "The autofocus property is set to: "+R;
}

  1. HTMLDOM入力範囲名プロパティ

    HTML DOM入力範囲名プロパティは、入力範囲フィールドの名前属性を設定または返すために使用されます。 name属性は、サーバーに送信された後のフォームデータを識別するのに役立ちます。 JavaScriptは、name属性を使用して、後で操作するためのフォーム要素を参照することもできます。 構文 以下は、-の構文です。 名前プロパティの設定- rangeObject.name = name 例 ここで、nameはレンジスライダーコントロール名を指定するためのものです。 範囲名プロパティの例を見てみましょう- <!DOCTYPE html> <html> <

  2. HTMLDOM入力範囲の最小プロパティ

    HTML DOM入力範囲の最小プロパティは、範囲スライダーコントロールの最小属性値を設定または返すために使用されます。この属性は、スライダーコントロールの最小値を示すために使用され、スライダーが移動できる値の範囲を作成するためにminプロパティとともに使用されることがよくあります。 構文 以下は、-の構文です。 Rangeminプロパティの設定- rangeObject.min = number ここで、数字は最小スライダー制御値を表します。 例 入力範囲の最小プロパティの例を見てみましょう- <!DOCTYPE html> <html> <bo