ホームページ > ウェブフロントエンド > jsチュートリアル > jQueryのselect操作制御方法まとめ_jquery

jQueryのselect操作制御方法まとめ_jquery

WBOY
リリース: 2016-05-16 18:26:24
オリジナル
981 人が閲覧しました

ここでのコードの多くは jquery 1.32 より前のバージョン用であることに注意してください (それ以降のバージョンでは @ がサポートされなくなりました)。そのため、空のコードに置き換えてテストしてください。

jQuery は Select のテキストと値を取得します:
構文の説明:
1. $("#select_id").change(function(){//code)。 ..}); //項目の 1 つが選択されたときにトリガーされる Select のイベントを追加します
2. var checkText=$("#select_id").find("option:selected").text( ); // Select
で選択されたテキストを取得します。 var checkValue=$("#select_id").val(); // Select
で選択された値を取得します。 var checkIndex=$("# select_id ").get( 0).selectedIndex; //Select

5 で選択されたインデックス値を取得します var maxIndex=$("#select_id option:last").attr("index"); / /Select の最大インデックス値を取得します

jQuery は Select のテキストと値を設定します:
構文説明:
1. $("#select_id ").get( 0).selectedIndex=1; / /選択する場合は、選択インデックスの値を 1 に設定します。$("#select_id ").val(4); //選択する場合は、選択する値を 4 に設定します。
3. $("#select_id ") option[text='jQuery']").attr("selected", true); //Select の Text 値を選択した jQuery 項目に設定します



選択オプション項目を追加/削除する jQuery: 構文説明:
1. $("#select_id").append("
Text に追加します。 $("#select_id").prepend("
3. $("#select_id option :last").remove(); //Select (最後のもの) で最大のインデックス値を持つオプションを削除します $("#select_id option [index='0']").remove(); //Select (最初のオプション) のインデックス値 0 のオプションを削除
5. $("#select_id option[value='3']") .remove(); //Select
5 の Value='3' のオプションを削除します。 $("#select_id option[text='4']").remove(); //テキストを含むオプションを削除します='4' in


//オプションをトラバースし、オプションを追加および削除します
function changeShipMethod(shipping){
var len = $("select[@name=ISHIPTYPE] オプション").length
if(shipping.value != "CA") {
$("select[@name=ISHIPTYPE] オプション").each(function(){
if($(this ).val() == 111){
$(this).remove();
}
});
$("
UPS グラウンド
").appendTo($("select[@name=ISHIPTYPE]" ));
}

// ドロップダウン メニューの選択値を取得します

$(#testSelect option:selected').text();
または $("#testSelect").find('option:selected').text(); または $ ("#testSelect").val();
////// ///////////////////// /////////////////////// /////////
記憶力が悪い場合は、保存してください:
1、ドロップダウン ボックス:

var cc1 = $(".formc select[@name='country' ] option[@selected]").text(); // のテキストを取得します。ドロップダウン メニューで選択した項目 (中央のスペースに注意してください)
var cc2 = $('.formc select[@name="country"]' ).val(); // の値を取得します。ドロップダウン メニューで選択された項目
var cc3 = $('.formc select[@name="country"]').attr("id"); // のドロップダウン メニュー ID 属性値を取得します。メニューで選択した項目
$("#select").empty();//ドロップダウン ボックスをクリアします//$("#select").html('');
$( "
1111
").appendTo("#select")// ドロップダウン ボックスのオプションを追加します

少し説明します: を持ち、属性値が 'country' である select 要素内の selected 属性を持つオプション要素を意味します。 @ で始まるものはすべてであることがわかります。属性が後に続くことを意味します。

2, ラジオボタン:
$("input[@type=radio][@checked]").val() //ラジオボタンの選択項目の値を取得します(注)中央 スペースなし)
$("input[@type=radio][@value=2]").attr("checked",'checked') //ラジオ ボタンの value=2 を選択した値に設定します。 state. (間にスペースがないことに注意してください)

3、チェックボックス:
$("input[@type=checkbox][@checked]").val();チェックボックスを選択した状態を取得します 最初の項目の値
$("input[@type=checkbox][@checked]").each(function(){ //通常は複数のチェックボックスが選択されているため、出力はループされる
alert($(this).val());

$("#chk1").attr("checked",'');//チェックを解除
$("#chk2").attr("checked",true);//Tick
if($("#chk1").attr('checked')==unknown){} //チェックされているかどうかを確認します


もちろん、jquery のセレクターは強力です。





ああああ



var item = $('input[@name=items][@checked]' ). val();
select
var item = $("select[@name=items] option[@selected]").text();ドロップダウン ボックスの項目 2 つの要素は現在選択されている値です
$('#select_id')[0].selectedIndex = 1;
ラジオ選択グループの 2 番目の要素は現在選択されている値ですvalue
$('input[@ name=items]').get(1).checked = true;
値の取得:
テキスト ボックス、テキスト領域: $("#txt").attr ("value");
複数のチェックボックス: $("#checkbox_id").attr("value");
ラジオ グループ radio: $("input[@type=radio][@checked]") .val();
ドロップダウン ボックスの選択: $('#sel').val();
コントロール フォーム要素:
テキスト ボックス、テキスト エリア: $("#txt")。 attr("value",'') ;//内容をクリア
$("#txt").attr("value",'11');//内容を埋める
複数選択ボックス チェックボックス: $( "#chk1").attr(" selected",'');//未チェック
$("#chk2").attr("checked",true);//チェックあり
if($(" #chk1").attr ('checked')==unknown) //
ラジオ グループ radio がチェックされているかどうかを判断します: $("input[@type=radio]").attr("checked",' 2');// value=2 の項目を現在選択されている項目として設定します
ドロップダウン ボックス select: $("#sel").attr("value",'-sel3');//Set現在選択されている項目として value=-sel3 を持つ項目
$("
1111

2222").appendTo("#sel")//ドロップのオプションを追加-down box $("#sel").empty( ); //ドロップダウン ボックスをクリアしますラジオで選択された項目のセットの値を取得します
var item = $( 'input[@name=items][@checked]').val();
select
var item = $("select[@name=items] option[@ selected]").text();
選択ドロップダウン ボックスの 2 番目の要素は、現在の選択値です
$('#select_id')[0].selectedIndex = 1;
2 番目の要素ラジオラジオ選択グループの要素は現在選択されている値です
$('input[@name=items]' ).get(1).checked = true
値の取得:
テキスト ボックスエリア: $("#txt").attr("value");
複数選択ボックス チェックボックス: $("#checkbox_id").attr("value");
ラジオ選択グループ radio: $( "input[@type=radio][@checked]").val();
ドロップダウン ボックスの選択: $('#sel').val();
コントロール フォーム要素:
テキストボックス、テキストエリア: $("#txt").attr("value",'');//内容をクリア
$("#txt").attr("value",'11') ;//内容を記入
複数選択ボックス チェックボックス: $("#chk1").attr("checked",'' );//未チェック
$("#chk2").attr("checked" ,true);//Checked
if($("#chk1").attr('checked') ==unknown) //
ラジオ グループ radio がチェックされているかどうかを判断します: $("input[@ type=radio]").attr("checked",'2');//Set value=2 項目は現在選択されている項目です
ドロップダウン ボックスの選択: $("#sel").attr( "value",'-sel3');//項目設定 value=-sel3 は現在選択されている項目です
$( "
1111

2222$("#sel").empty();//ドロップダウン ボックスをクリアします詳細については、を参照してください。以下の記事:

Jquery Select操作方法集 スクリプトハウス特別編

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート