1

ページに 2 つの選択ボックスがあり、可変数のオプションがあります。

例えば：

<fieldset>
    <label for="fizzwizzle">Select a Fizzwizzle</label>
    <select name="fizzwizzle" id="fizzwizzle" size="10">
        <option>Fizzwizzle_01</option>
        <option>Fizzwizzle_02</option>
        <option>Fizzwizzle_03</option>
        <option>Fizzwizzle_04</option>
    </select>
</fieldset>
<fieldset>
    <label for="fizzbaggot">Select a Fizzbaggot</label>
    <select name="fizzbaggot" id="fizzbaggot" size="10">
        <option>Fizzbaggot_01</option>
    </select>
</fieldset>

これらの選択ボックスの両方に選択されたオプションがあることを確認したいと思います。私の最初の考えは、単純に JQuery を使用することですが、その方法を理解できないようです。これまでの私の試みは無駄でしたが、ミッシングリンクで動作すると思われる次のコードがあります。

function verify_selectboxen_selection() {
    var allSelected = true;

    $('select').each(function() {
      /* if select box doesn't have a selected option */
            allSelected = false;
            break;
    });

    if (!allSelected) {
        alert('You must select a Job and a Disposition File.');
    }
    return allSelected;
}

十分に単純に思えます。考え？

4

4 に答える 4

3

jQuery では、セレクターを使用して、:selected選択されたオプションの合計を取得できます。この数は、select 自体の数と一致します。

if ($("select").length === $("option:selected").length) {
  // they match
}
于 2010-02-19T14:13:25.790 に答える
2

これらの選択ボックスの両方に選択されたオプションがあることを確認したい

(非multiple)selectボックスにオプションが選択されていないことはありえません! selectedのいずれかで宣言しない場合option、ブラウザーは自動的に最初のオプションを選択します。

そう: return true;:-)

「選択されていない」初期状態が必要な場合は、オプションなしoption、通常は最初の状態を含める必要があります。

<select name="fizzbaggot">
    <option value="" selected="selected">(Select a fizzbaggot)</option>
    <option>foo</option>
    <option>baz</option>
    <option>bar</option>
</select>

次に、次のいずれかの方法で、そのオプションとは異なるオプションが選択されているかどうかを確認できます。

$('select').each(function() {
    if ($(this).val()!=='')
        allSelected= false;
});

または、空の文字列を有効な値として使用したい場合は、選択したオプションのインデックスを確認できます。

$('select').each(function() {
    if (this.selectedIndex===0)
        allSelected= false;
});
于 2010-02-19T15:11:54.640 に答える
1

これには:selected セレクターを使用できます。

var unselected = [] 
$('select').each(function(){
    if (0 == $(this).find('option:selected').length) {
        unselected.push(this.id);
    }
});

if (unselected.length != 0) {
    // unselected contains the ids of non-selected select boxes
}

または、 val()で値を確認できます。これは、値のないデフォルト オプション (つまり、空の文字列値) があることを前提としています。

var unselected = [] 
$('select').each(function(){
    if ('' == $(this).val()) {
        unselected.push(this.id);
    }
});

if (unselected.length != 0) {
    // unselected contains the ids of non-selected select boxes
}
于 2010-02-19T14:10:01.460 に答える
0 
 function checkSelects() {
        return $("select :selected").length == $("select").length;
    }

alert(checkSelects());
于 2010-02-19T14:17:41.647 に答える