web-dev-qa-db-ja.com

オプションが選択されているかどうかを確認する方法

$('#mySelectBox option').each(function() {
    if ($(this).isChecked())
       alert('this option is selected');
     else
       alert('this is not');
});

どうやらisCheckedは動作しません。 SO私の質問は、これを行う適切な方法は何ですか?ありがとう。

134
0x56794E

UPDATE

選択されたオプションに対するより直接的なjQueryメソッドは次のようになります。

var selected_option = $('#mySelectBox option:selected');

.is(':selected')という質問に答えるのは、あなたが探しているものです。

$('#mySelectBox option').each(function() {
    if($(this).is(':selected')) ...

これを行うための非jQuery(おそらくベストプラクティス)方法は次のようになります。

$('#mySelectBox option').each(function() {
    if(this.selected) ...

ただし、選択した値を探しているだけの場合は、次のことを試してください。

$('#mySelectBox').val()

あなたが選択された値のテキストを探しているならば:

$('#mySelectBox option').filter(':selected').text();

チェックアウト: http://api.jquery.com/selected-selector/

次回は重複するSO質問を探します。

現在の選択オプションを取得 or 選択オプションの設定 or jQueryで$(this)選択オプションを取得する方法 または option [selected] = true]動作しません

231
iambriansreed

あなたはこのように選択されたオプションを得ることができます:

$('#mySelectBox option:selected')...

LIVE DEMO

しかし、すべてのオプションを反復したい場合は、存在しないthis.selectedではなくthis.isCheckedを使用してください。

$('#mySelectBox option').each(function() {
    if (this.selected)
       alert('this option is selected');
     else
       alert('this is not');
});

LIVE DEMO

更新:

あなたはこれを使うことを提案するたくさんの答えを得ました:

$(this).is(':selected')さて、それはthis.selectedでずっと速くそしてより簡単にされることができます、それでなぜあなたはそれを使うべきで、ネイティブのDOM要素メソッドではありませんか?

お読みくださいjQueryにあるDOMのプロパティと関数を知っているタグ情報

26
gdoron

is()に慣れていない、または慣れていない場合は、単にprop("selected")の値を確認することができます。

ここに見られるように

$('#mySelectBox option').each(function() {
    if ($(this).prop("selected") == true) {
       // do something
    } else {
       // do something
    }
});​

編集

コメントで@gdoronが指摘したように、オプションの選択されたプロパティにアクセスするためのより速くそして最も適切な方法はDOMセレクターを通してです。これが、このアクションを表示する pdate フィドルです。

if (this.selected == true) {

同様に動作するようです!ありがとうgdoron。

3
veeTrain

これを選択リストと考えてください。

<select onchange="var optionVal = $(this).find(':selected').val(); doSomething(optionVal)">

                                <option value="mostSeen">Most Seen</option>
                                <option value="newst">Newest</option>
                                <option value="mostSell">Most Sell</option>
                                <option value="mostCheap">Most Cheap</option>
                                <option value="mostExpensive">Most Expensive</option>

                            </select>

それからあなたはこのように選択されたオプションをチェックします:

function doSomething(param) {

    if ($(param.selected)) {
        alert(param + ' is selected!');
    }

}
2

つかいます

 $("#mySelectBox option:selected");

その特定のオプションがmyoptionであるかどうかをテストします。

 if($("#mySelectBox option:selected").text() == myoption){
          //...
 }
1
Mouna Cheikhna

オプションの選択状態を特定の値で確認する必要がある場合

$('#selectorId option[value=YOUR_VALUE]:selected')
0
dimpiax

オプションが選択されているかどうかだけを確認したい場合は、すべてのオプションを繰り返す必要はありません。やるだけ

if($('#mySelectBox').val()){
    // do something
} else {
    // do something else
}

注:選択可能にしたいvalue = 0のオプションがある場合は、if-conditionを$('#mySelectBox').val() != nullに変更する必要があります。

0
Adam

私の場合、なぜselectedが常に正しいのかわかりません。だから私が考え出すことができた唯一の方法は以下のとおりです。

var optionSelected = false;
$( '#select_element option' ).each( function( i, el ) {
    var optionHTMLStr = el.outerHTML;

    if ( optionHTMLStr.indexOf( 'selected' ) > 0 ) {
        optionSelected = true;
        return false;
    }
});
0

あなたはjqueryによってこのように使うことができます:

$(document).ready(function(){
 $('#panel_master_user_job').change(function () {
 var job =  $('#panel_master_user_job').val();
 alert(job);
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="job" id="panel_master_user_job" class="form-control">
                                    <option value="master">Master</option>
                                    <option value="user">User</option>
                                    <option value="admin">Admin</option>
                                    <option value="custom">Custom</option>
                                </select>
0
amir