JQuery操作のラジオボタンとチェックボタン example_jquery

開発プロセスでよく使われるラジオボタンとチェックボタン。 次に、JQuery でラジオボタンとチェックボタンを操作します:

ラジオボタン:

があります。 JQuery を通じてラジオ ボタン オブジェクトを取得する 3 つの方法:

①ID: $("#radioId")

②NAME: $(":input[name='radioName' ]")

③TYPE: $("input[type=radio]")、いくつかの情報は次のようになります: $(""input[@type=radio]"")、この場合、JQuery のバージョンと関係があります古いバージョンの場合は後者を使用し、新しいバージョンの場合は前者を使用してください。いずれにしても、1 つで完了します。試してみて、それでも効果があるのですから、ぜひやってみてください。

この効果を実現するには、ID を同じものに変更すればよいと考える人も多いでしょう。実際に試してみるとわかります。グループ内で複数のラジオ ボタンを選択できること。この効果を実現するための重要な属性は ID ではなく、NAME であるためです。

紹介の後、その使用法を詳しく見てみましょう:

ラジオ ボタンのオブジェクトを取得した後、オブジェクトをトラバースする必要があります。このオブジェクトの型は配列であるため、一つ一つ選択されているかどうかを判断し、選択されたボタンから必要な値を取り出す必要があります。 サンプルコードは次のとおりです。

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

var itemradio = $("input[type=radio]");
result=""; .length;
for(i=0;iif(itemradio[i].checked){
result = itemradio[i].value "," itemradio[i] .id " ;" result;
}
}

result は、誰でも理解できる値ですが、後ろの ID はわかりにくいかもしれません。一部の人々。 。ここで展開します。JS 内のすべてのオブジェクトは、「.」を通じて属性の値を直接取得できます。


チェックボックス:
チェックボックスに関しては、JQueryを使えば「全選択と逆選択」の効果だけで済みます。次のような一文です:

コードをコピーします コードは次のとおりです:

var selectedObj = $('input:checkbox[ name="checkbox"]:checked');
var value = "";
checkedObj.each(function() {
var value=this.value " ,";
values = value ;
});

上記の 2 つのコードで、チェック ボックスとラジオ ボタンを操作できます。