ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryでラジオボタンを選択済みに設定する方法(2つの方法)

jqueryでラジオボタンを選択済みに設定する方法(2つの方法)

PHPz
PHPzオリジナル
2023-04-10 14:22:183977ブラウズ

フロントエンド開発では、ラジオ ボタンは非常に一般的なフォーム コントロールです。場合によっては、ユーザーが手動でラジオボタンを操作するのを待つのではなく、ページの読み込み時にラジオボタンを選択状態に設定する必要がある場合があります。現時点では、jQuery を使用してこの要件を達成できます。

次に、一般的に使用される 2 つの簡単な方法を示します。

方法 1: .prop() メソッドを使用する

.prop() メソッドは、最初に一致した要素の属性値を取得するために使用されます。 .prop() メソッドを使用して、ラジオ ボタンの選択状態を設定できます。具体的な実装は次のとおりです。

//选中id为radio1的单选框
$("#radio1").prop("checked", true);

上記のコードでは、まずラジオ ボタンの ID セレクターを選択し、次に .prop() メソッドを使用してその選択状態を true に設定します。このようにして、ページが読み込まれた後、ラジオ ボタンが自動的に選択されます。

方法 2: .attr() メソッドを使用する

.attr() メソッドは、指定された属性の値を取得するために使用されます。以下は、.attr() メソッドを使用してラジオ ボタンの選択状態を設定する実装です:

//选中name为radio的值为value的单选框
$("input[name='radio'][value='1']").attr("checked", true);

上記のコードでは、最初にラジオ ボタンの名前セレクターを選択し、値を次のように指定しました。 '1'. 最後に、.attr() メソッドを使用して、選択されたステータスを true に設定します。

.attr() メソッドを使用してラジオ ボタンの選択状態を設定する場合、代わりに prop() メソッドを使用することもできます。この 2 つの効果は同じです。

上記の 2 つのメソッドに加えて、.val() メソッドを使用して、選択したラジオ ボタンの値を設定することもできます。具体的な実装は自分で実践できるので、ここでは繰り返しません。

要約すると、フロントエンド開発では、jQuery を使用してラジオ ボタンの選択状態を設定するのが非常に簡単で便利です。必要なのは、ニーズを満たす適切な方法を選択することだけです。

以上がjqueryでラジオボタンを選択済みに設定する方法(2つの方法)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。