1

ページ上に5つの選択コントロールがあり、それぞれが同じオプション値を持っています。最初のドロップダウンで1つの値を選択したときに、他のドロップダウンで同じ値を再度選択することはできません。私は以下のようなことを試みました。

$("#div").find(".selectClass").live("change", function (e) {
    var selectedValue = $(this).val();
    var controlId = $(this).attr("id");
    var isPropertyAlreadySelected = false;

    $("#div").find(".selectClass").each(function () {
        var currentSelect = $(this);
        if (controlId != currentSelect.attr("id") && currentSelect.val() == selectedValue) {
            isPropertyAlreadySelected = true;
        }
    });

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

編集：フラグ「isPropertyAlreadySelected」のチェックを削除しました。それでも、他のドロップダウン値を選択することはできます。

「returnfalse」または「e.preventDefault（）」を実行しても、他のドロップダウンで値が選択されたままになります。私を正しい方向に向けてください。前もって感謝します！！

4

3 に答える 3

1

他の人が言っているように、値はすでに変更されているので、それは不可能のようです。

この関連する質問と解決策を参照してください：jQueryはselectの変更を防ぎます

これがjsFiddleの問題の最小限の再現です

于 2012-09-17T15:27:35.247 に答える
1

実行している問題は、changeイベントが発生したときにselectの値がすでに変更されていることです。

現在選択されている値のリストを用意し、ここで変更されたオプションをリセットする必要があります。

if (isPropertyAlreadySelected) {
    // Reset here
}

ページの読み込み時に選択された値を配列に入力し、オプションが選択されるたびにこの配列を更新するだけです。

mousedownイベントでテストしました。これは、オプションが実際に選択される前に発生します。ここで試してください：http：//jsfiddle.net/g3rsF/1/

ユーザーはキーを押すことでも選択できるため、これはすべての場合に解決されるわけではありません。

于 2012-09-17T15:39:35.587 に答える
0

ドロップダウンに現在選択されているアイテムを保存し、この小さなヘルパーを操作します:)

<select id="s1" class="selectClass">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

<select id="s2" class="selectClass">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>​

。

$(document).on("change", ".selectClass", function(ev) {
    var cur = $(this),
        text = cur.find("option:selected").text(),
        isAlreadySelected;

    isAlreadySelected = $(".selectClass").not("#" + this.id).filter(function() {
        return $(this).find("option:selected").text() === text;
    });

    if (isAlreadySelected.length) {
        cur.prop("selectedIndex", cur.prop("selIdx") || 0);
    }

    cur.data("selIdx", cur.prop("selectedIndex"));
});​

例

于 2012-09-17T15:46:13.647 に答える