web-dev-qa-db-ja.com

JQuery / Javascriptを使用して選択ボックスが空かどうかを確認する方法

JQuery Mobileを使用すると、データベースから動的に入力される選択ボックスがあります。現時点では、このチェックボックスの設定は問題なく機能しています。 「クリック時」イベントを介して関数を呼び出すボタンで構成される機能を追加しました。この関数の仕事は、この特定のチェックボックスが設定されているかどうかを知ることです。そうでない場合は、単に何もしませんが、そうでなければスムーズに実行されます。私の問題は、この選択ボックスが空かどうかを判断することです。

以下は、私が扱っていることの非常に単純化された例です。

_<li>
    <label for="fruit_name">Fruit</label>
    <select name="some_fruit" id="fruit_name" onclick="populate_box('fruit', this);">
    </select>
</li>
_

別のボタンから呼び出される私の関数は、次のようになります。

_function isSelextBoxEmpty(selectBoxId) {
    var selected_value = $('#fruit_name');

    /* More options... still testing the proper way:
    var selected_value = $('#fruit_name').text;
    var selected_value = $('#fruit_name').value;
    var selected_value = $('#fruit_name').length;
    var selected_value = $('#fruit_name option:selected', this);
    var selected_value = document.getElementById('fruit_name');
    var selected_value = document.getElementById('fruit_name').length;
    var selected_value = document.getElementById('fruit_name').value;
    var selected_value = document.getElementById('fruit_name').innerHTML;
    */

    if(selected_value) {
        alert("NOT null, value: " + selected_value);
        //do something
    }
    else {
        alert("null, value: " + selected_value);
        //do something
    }
}
_

これが何をするのか、どのように行うのか心配する必要はありません。今私にとって重要なのは、チェックボックスが空かどうかを確認できないことです。どうすればいいのかわかりません。私はフォーラムやドキュメントをよく読みましたが、実装自体に依存するため、これを行うには多くの影響があります。

たとえば、document.getElementById(...)...を使用しても必ずしもfalseが返されるわけではなく、使用方法によって異なります。また、jQueryで$("#someID")...を使用しても、目的の結果が得られる場合と得られない場合があります。 コメント行でわかるように、私はすでに何度も試しましたが、それらはすべてif(...)ステートメントで評価できます。

これを達成する方法について提案やアイデアはありますか?前もって感謝します!

28
AGE

選択ボックスに値があるかどうかを確認するには:

if( $('#fruit_name').has('option').length > 0 ) {

選択した値が空かどうかを確認するには:

if( !$('#fruit_name').val() ) { 
79
Engineer

選択した値を取得する1つの正しい方法は

var selected_value = $('#fruit_name').val()

そして、あなたはすべきです

if(selected_value) { ... }
12
Claudio Redi

選択した値を取得する別の正しい方法は、このセレクターを使用することです。

$("option[value="0"]:selected")

あなたに最適!

2
gmpacheco