ホームページ > 記事 > ウェブフロントエンド > HTMLでのチェックボックスとラジオイベント選択の使い方を詳しく解説
ラジオがクリック イベントを登録した後、キーボードの上下左右キーを使用して選択すると、実際にマウス イベントがトリガーされ、スクロール ホイールもトリガーされます。マウスダウンでは魔法のようなことは起こりません。 (Webkit では上下左右の選択は使用できません)
チェックボックスがクリックイベントを登録した後、スペースを含むチェックボックスを選択すると、魔法のクリックイベントが再びトリガーされ、マウスダウンが失敗しました。また奇跡が。 (Webkit はまだスペースを使用して選択することができません)
この 2 人に固有の欠点があるため、クリックを使用して負担を軽減しましょう。この 2 人にとって、クリックは全能です。礼拝~~~
フォームでアンケートを設計する場合、ユーザーの操作を軽減するために、HTMLのd5fd7aea971a85678ba271703566ebfdタグにはセレクトボックスが2種類あります。ボタンとチェック ボックスの違いは、ユーザーがラジオ ボタン ボックスでは 1 つのオプションのみを選択できるのに対し、チェック ボックスでは複数のオプションを選択したり、すべてを選択したりできることです。以下の例をご覧ください:
この例のソース コードを以下に示します。コードと組み合わせて、各パラメーターの設定について説明します。
d73df2bf3afc4a5bf2700693946ac088 旅行は好きですか?選択してください:
<input type="radio" name="radiobutton" value="radiobutton" checked> 喜欢 <input type="radio" name="radiobutton" value="radiobutton"> 不喜欢 <input type="radio" name="radiobutton" value="radiobutton"> 无所谓<br>興味のあるスポーツを選択してください:
<input type="checkbox" name="checkbox1" value="checkbox"> 跑步 <input type="checkbox" name="checkbox2" value="checkbox"> 打球 <input type="checkbox" name="checkbox3" value="checkbox"> 登山 <input type="checkbox" name="checkbox4" value="checkbox"> 健美<br>上記のソース コードからわかるように、ラジオ ボタンを作成するには、d5fd7aea971a85678ba271703566ebfd タグの type パラメータを type= に設定するだけです。 "radio" チェック ボックスを作成するには、d5fd7aea971a85678ba271703566ebfd タグの type パラメータを type="checkbox" に設定するだけです。実際のアプリケーションで使用される選択ボックスの種類については、実際のニーズに応じて決定する必要があります。ユーザーに選択肢が 1 つだけ必要な場合は、ラジオ ボタン ボックスを使用します。たとえば、この例では、「旅行は好きですか?」という質問では、ユーザーに選択肢が 1 つだけ必要であるため、ラジオ ボタン ボックスが使用されます。ユーザーは複数の選択肢を持つことができます。たとえば、この例では、人の興味は多面的である可能性があるため、「どのスポーツに興味がありますか?」という質問が使用されます。チェックボックスが使用されます。
d5fd7aea971a85678ba271703566ebfd タグにチェックされたパラメータを設定すると、ボックスがデフォルトで選択されます。たとえば、この例の最初のラジオ ボタン ボックス (「いいね」の下のラジオ ボタン ボックス) はデフォルトで選択されるように設定されているため、ユーザーが「いいね」を選択したい場合に再度選択する必要はありません。もちろん、ユーザーが「嫌い」を選択したい場合は、「嫌い」の下のラジオ ボタンをクリックするだけで、デフォルト値は自動的にキャンセルされます。同じ方法を使用して、デフォルトでチェックボックスが選択されるように設定することもできます。ただし、チェック ボックスのデフォルトの選択を悪用することはできません。悪用すると、ユーザーの不満を引き起こす可能性があります。
ラジオでは、すべての
以上がHTMLでのチェックボックスとラジオイベント選択の使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。