ホームページ >ウェブフロントエンド >jsチュートリアル >HTMLチェックボックスとラジオボタンのチェックボックスイベントとラジオイベントの紹介_基礎知識

HTMLチェックボックスとラジオボタンのチェックボックスイベントとラジオイベントの紹介_基礎知識

WBOY
WBOYオリジナル
2016-05-16 17:46:452219ブラウズ

チェックボックスとラジオのイベント選択で私はかつて混乱しました。

私の js の理解に基づくと、残念ながら、change イベントは、変更後にフォーカスが離れるときにのみトリガーされるのが最も合理的であると思います。
その後、代わりにクリック マウスダウンなどのマウス イベントが使用されるようになりました。

ラジオがクリック イベントを登録した後、キーボードで上下左右を選択するとマウス イベントがトリガーされるという魔法です。スクロールホイールもトリガーされます。この魔法のようなことは、マウスダウン時には起こりません。 (Webkit では上下左右の選択は使用できません)
チェックボックスがクリック イベントを登録した後、スペースを含むチェックボックスを選択すると、魔法のクリック イベントが再びトリガーされ、マウスダウンが発生します。また奇跡を逃してしまう。 (Webkit はまだスペースを使用して選択できません)

この 2 人には固有の欠点があるため、クリックを使用して負担を軽減しましょう。クリックは最高のオールマイティです。拝~~~

フォームを使ってアンケートを設計する場合、ユーザーの操作を軽減するために、HTMLのタグ内にセレクトボックスを使うと良いでしょう。選択ボックスとチェック ボックスの違いは、ユーザーがラジオ ボタン ボックスでオプションを 1 つだけ選択できるのに対し、チェック ボックスでは複数のオプションを選択したり、すべてのオプションを選択したりできることです。次の例を参照してください。

この例のソース コードをコードと組み合わせて、各パラメーターの設定について説明します。

🎜>旅行は好きですか?選択してください:

コードをコピー コードは次のとおりです:
好き
嫌い
問題ありません

どのスポーツに興味がありますか:

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

ボール遊び
🎜>



上記のソースコードから、ラジオボタンを作成するには、 タグの type パラメータを type="radio" に設定するだけです。 「チェックボックス」と入力します。実際のアプリケーションで使用される選択ボックスの種類については、実際のニーズに応じて決定する必要があります。ユーザーが 1 つの選択肢しか必要としない場合は、たとえば、「旅行は好きですか?」というオプションを 1 つだけ選択できるため、複数の選択肢が許可されている場合はラジオ ボタンが使用されます。たとえば、この例では、「どのスポーツに興味がありますか?」という質問は、人の興味が多面的である可能性があるため、チェック ボックスが使用されます。

タグにチェックされたパラメータを設定すると、ボックスがデフォルトで選択されます。たとえば、この例の最初のラジオ ボタン ボックス (「いいね」の下のラジオ ボタン ボックス) はデフォルトで選択されるように設定されているため、ユーザーが「いいね」を選択したい場合に再度選択する必要はありません。もちろん、ユーザーが「嫌い」を選択したい場合は、「嫌い」の下のラジオ ボタンをクリックするだけで、デフォルト値は自動的にキャンセルされます。同じ方法を使用して、デフォルトでチェックボックスが選択されるように設定することもできます。ただし、チェック ボックスのデフォルトの選択を悪用することはできません。悪用すると、ユーザーの怒りを引き起こす可能性があります。

ラジオでは、すべての オブジェクトの name 属性を必ず同じに設定してください。たとえば、上の例では name="radiobutton" です。は ID 属性ではありません。この方法でのみ効果が得られます。それ以外の場合は、上記の例の「好き」、「嫌い」、「無関心」を同時に選択できます。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。