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

ラベルタグを使用してテキストをクリックしてラジオボタンを選択します
<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 をクリックした後にページがジャンプしないようにするための空のリンクの正しい書き方 # 問題

推薦する

MySQLの左結合と内部結合について簡単に説明します

序文最近、X 省のコールド チェーン トレーサビリティ システムの開発で忙しくしています。毎日午後 ...

MySQL 8.0.17 winx64 (Navicat 付き) 手動構成バージョンのインストール チュートリアル図

1. ダウンロードアドレス: mysql-8.0.17-winx64ダウンロードして解凍する2. フ...

HTML 固定タイトル列、タイトル ヘッダー テーブル固有の実装コード

コードをコピーコードは次のとおりです。 <!DOCTYPE html PUBLIC "...

Dockerはmysqldumpコマンドを使用してプロジェクト内のmysqlデータをバックアップおよびエクスポートします。

mysqldump コマンドはじめに: データベースバックアッププログラム形式: mysqldum...

Linuxはiptablesを使用して複数のIPからのサーバーへのアクセスを制限します

序文Linux カーネルでは、netfilter は、パケット フィルタリング、ネットワーク アドレ...

docker を使用してシンプルな C/C++ プログラムをデプロイする方法

1. まずhello-world.cppファイルを作成しますプログラムコードは次のとおりです。 #i...

ブートストラップテーブルの使い方のまとめ

この記事では、bootstrapテーブルの使い方を参考までに紹介します。具体的な内容は次のとおりです...

Reactは感情を使ってCSSコードを書く

目次導入:感情のインストール:一般的な CSS コンポーネントを追加します。既存のコンポーネントにス...

jQueryはショッピングカート機能を実装します

この記事の例では、ショッピングカート機能を実装するためのjQueryの具体的なコードを参考までに共有...

フロントエンドページのポップアップマスクはページのスクロールを禁止します

フロントエンド開発者がよく遭遇する問題は、ユーザーに情報を提示するためのポップアップ ウィンドウを作...

Vue で HTML 5 ドラッグ アンド ドロップ API を使用する方法

ドラッグ アンド ドロップ API は、ドラッグ可能な要素を HTML に追加し、ドラッグ可能な豊富...

MySQL 最適化チュートリアル: 大規模なページングクエリ

目次背景制限の最適化最適化方法1. カバーインデックスを使用する2. サブクエリの最適化3. 遅延連...

MySQL の左結合操作における on 条件と where 条件の違いの紹介

優先度両方のケースで同じ条件を設定すると、異なる結果セットが生成される可能性があるのは、優先順位のた...

JSはショッピングカート内の商品の合計金額の計算を実現します

JSはショッピングカート内の商品の合計金額を計算して参考とします。具体的な内容は以下のとおりです。質...

概要ページでのフロートとクリアフロート

1. フロート: 主な目的は、テキストを画像の周囲に折り返す効果を実現することです。また、複数列レイ...