3

私の質問はこれに似ています: 複数の <select> ボックスで選択されている場合、jQuery <select> オプションは無効です

そしてこれ： 他の<select>で選択された場合、jQuery <select>オプションは無効になります

しかし違う。

私はこのhtmlフォームを持っています:

<form method="post" action="" name="form_letter">
<label for="letter">Letter</label><br>
<select multiple="multiple" name="letter[]" id="letter">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>

<label for="list_of_a">List of A</label><br>
<select multiple="multiple" name="list_of_a[]" id="list_of_a">
    <option value="A1">A1</option>
    <option value="A2">A2</option>
    <option value="A3">A3</option>
    <option value="A4">A4</option>
</select>

<label for="list_of_b">List of B</label><br>
<select multiple="multiple" name="list_of_b[]" id="list_of_b">
    <option value="B1">B1</option>
    <option value="B2">B2</option>
    <option value="B3">B3</option>
    <option value="B4">B4</option>
</select>

<label for="list_of_c">List of C</label><br>
<select multiple="multiple" name="list_of_c[]" id="list_of_c">
    <option value="C1">C1</option>
    <option value="C2">C2</option>
    <option value="C3">C3</option>
    <option value="C4">C4</option>
</select>

<input type="submit" value="Save">
</form>​

私が達成したいのは、optionofが選択されていないときにボタンselect[name="letter[]"]をクリックすると、対応する文字のリストがorになります。submitselectnullempty

シナリオ:
1. が選択されていない場合はoption、ボタンをselect[name="letter[]"]クリックします。 2. B と C についても同じことが言えます。 3.のオプションが選択されていない場合、 、、およびは空です。submitselect[name="list_of_a[]"]emptynull



letterlist_of_alist_of_blist_of_c

これは私のjsです:

$("form[name='form_letter']").on("submit", function(e) {
    if ($("select[name='letter[]']").find("option:not(:selected)").val() == "A") {
        $("select[name='list_of_a[]']").val("");
    };

    if ($("select[name='letter[]']").find("option:not(:selected)").val() == "B") {
        $("select[name='list_of_b[]']").val("");
    };

    if ($("select[name='letter[]']").find("option:not(:selected)").val() == "C") {
    $("select[name='list_of_c[]']").val("");
    };

alert("A = " + $("select[name='list_of_a[]']").val() + " and B = " + $("select[name='list_of_b[]']").val() + " and C = " + $("select[name='list_of_c[]']").val());

    e.preventDefault();
    return false;
});​

私はここで取り組んできましたhttp://jsfiddle.net/VPhPv/21/
しかし行き詰まりました。お願い助けて。

4

2 に答える 2

2

あなたの問題は、のと等しい単一の値を比較していること:notです:selected。あなたが書いたように、あなたはあなたのif比較で真の状態に入ることが決してありません。アラートを入れる（またはデバッガーを使用する）と、これが表示されます。

代わりに、選択した値に対して等しくない比較を行う必要があります。

:selected").val() !=

適切なソリューションjsfiddle

セレクターで要素IDを使用することで、状況を少し改善することもできます。

于 2012-12-18T17:53:02.863 に答える
1

私のコメントが近かったので。あなたが必要だと思う最後の仕上げをしようと思いました。

arrayこのような複数オプションの選択ボックスはof の値を返すことに注意してください。

http://jsfiddle.net/VPhPv/31/

対応コード。

var $form = $('#myForm'),
    $letterlist = $('#letter'),
    $listA = $('#list_of_a'),
    $listB = $('#list_of_b'),
    $listC = $('#list_of_c');

$form.on("submit", function(e) {
    var a, b, c;

    if ($letterlist.val().indexOf("A") != -1) {
        a = $listA.val();
    };

    if ($letterlist.val().indexOf("B") != -1) {
        b = $listB.val();
    };

    if ($letterlist.val().indexOf("C") != -1) {
        c = $listC.val();
    };

    alert("A = " + a + ", B = " + b + " and C = " + c);

    e.preventDefault();
    return false;
});​
于 2012-12-19T14:49:30.677 に答える