ラベルタグを使用してテキストをクリックしてラジオボタンを選択します

ラベルタグを使用してテキストをクリックしてラジオボタンを選択します
<label> タグは、入力要素のラベル (タグ) を定義します。ラベル要素はユーザーに対して特別な効果をもたらしません。ただし、マウスユーザーにとっては使いやすさが向上します。このコントロールは、ラベル要素内のテキストをクリックするとトリガーされます。つまり、ユーザーがタグを選択すると、ブラウザは自動的にフォーカスをタグに関連付けられたフォーム コントロールに移動します。 <label>タグのfor属性は、関連する要素のid属性と同じである必要があります。

例1:

コードをコピー
コードは次のとおりです。

<label for="男性">
<input type="radio" value="男" name="man" id="man"/>

</ラベル>
<ラベル for="man2">
<input type="radio" value="女" name="man" id="man2"/>
女性
</ラベル>

例2:

コードをコピー
コードは次のとおりです。

<input type="checkbox" name="Pages" value="Job" id="Job" ><label for="Job">求人情報を追加および編集する</label>

<input type="checkbox" name="Pages" value="JobQuery" id="JobQuery" &gt;<label for="JobQuery">採用情報の照会と削除</label>

<input type="checkbox" name="Pages" value="Technology" id="Technology" チェック済み&gt;<label for="Technology">テクノロジー項目を追加または変更する</label>

<<:  JS上級編ES6の6つの継承方法

>>:  href をクリックした後にページがジャンプしないようにするための空のリンクの正しい書き方 # 問題

推薦する

JS でオブジェクト プロパティを簡単にトラバースするいくつかの方法

目次1. 自己列挙可能なプロパティ2. Object.values()はプロパティ値を返します3. ...

カルーセル例の JavaScript 実装

この記事では、カルーセルの効果を実現するためのJavaScriptの具体的なコードを参考までに共有し...

CSS スティッキーレイアウトを使用してヘッダーを上部に配置する方法

適用シナリオ:新しい要件の 1 つはアンケート調査を行うことですが、必然的に多くの質問が含まれ、1 ...

ハッシュテーブルのJavaScript実装の詳細な説明

目次1. ハッシュテーブルの原理2. ハッシュテーブルの概念3. ハッシュ競合問題1. チェーンアド...

JS正規RegExpオブジェクトについての簡単な説明

目次1. RegExpオブジェクト2. 文法2.1 定義2.2 修飾子2.3 角括弧2.4 メタ文字...

XHTML タグのネスト規則の分析

XHTML 言語では、ul タグに li が含まれ、dl タグに dt と dd が含まれることは誰...

Javascript の奇妙な点をご存知ですか?

私たちのベテランの先人たちは、数え切れないほどのコードを書き、数え切れないほどの落とし穴に陥ってきま...

bitronix を使用して MySQL に接続するときの MySQLSyntaxErrorException の解決方法

bitronix を使用して MySQL に接続するときの MySQLSyntaxErrorExce...

JS はシンプルなブロック崩しピンボールゲームを実装します

この記事では、ブロック崩しピンボールゲームを実装するためのJSの具体的なコードを参考までに紹介します...

Nginx+SSL による双方向認証を実装するためのサンプル コード

まずディレクトリを作成する cd /etc/nginx mkdir ssl cd ssl CA と自...

Mysql マスタースレーブ サービスの実装例を構成する

Mysql マスタースレーブ サービスの実装例を構成する### メインデータベースmy.cnfを構成...

Docker ロード後にイメージ名が none になる問題の解決方法

最近、docker load -i コマンドを使用してイメージ パッケージを圧縮した後、イメージ名と...

Nginx 構成の場所の一致ルールの例の説明

nginx の設定命令のスコープは、main、server、location の 3 種類に分けられ...

関数の分類の詳細な説明とJavascriptでのこのポイントの例

JS で関数を定義する 3 つの方法例を挙げて説明しましょう。 <スクリプト> //メソ...