0

I have tried to bind those two code ideas together but it isn't working.

I want to disable the first option from being selectable after a selection has been made.

This is the behavior I'm wanting; the first option is disabled after a selection is made.

And this is my code where I want the first option disabled when a subsequent element is picked.

4

2 に答える 2

1

[更新された回答]

http://jsfiddle.net/N9JEx/2/

function displayVals() {
    var singleValues = $("select option:selected").text();
    if (!isNaN(singleValues )) {
        $("#hiddenselect").val(singleValues);
        $("<p></p>").html("Percent of : &nbsp" + singleValues).appendTo('body');
    }
}

$(document).ready(function() {
    $("select").change(function() {
        displayVals();
        if (this.selectedIndex > 0) {
            var option = $('option:selected', this);
            option.prop('disabled', true);
        }
    });
});​
于 2012-05-17T20:19:52.497 に答える
1

これがあなたの質問に答えていると思います：

http://jsfiddle.net/dq97z/66/

内部でdisplayVals次を実行しました：

if ($("#menucompare").prop("selectedIndex") !== "0") {
    // Within the select (you could be more specific) find
    // the first (direct descendant) option value and 
    // disable it to make it unselectable
    $("select > option:first").prop("disabled", "disabled")
}

このセグメントは、選択メニューの選択されたインデックスが何であるかを調べ、ユーザーが最初のもの (0) 以外のものを選択した場合、最初のオプションを無効に設定します。

更新: http://jsfiddle.net/dq97z/72/

ドキュメントと@silksterのアドバイスに従って無効にするときに変更attr()されました。ありがとうprop()

また、最初にオプションを選択可能にしたくない場合は、ここで見られるように if ステートメントなしで行うこともできます。

function displayVals() {
    var singleValues = $("select option:selected").text();
    ....
    $("select > option:first").prop("disabled", "disabled")
}

無効化は DOM がロードされた後に行われるため (最初の DOM は無効化されていません)、選択で「選択してください」を選択したままにすることができます。おっと...それはたくさんの「選択」です。

if ステートメントをそこに残したい場合 (つまり、別のステートメントが実際に選択されるまで「1 つを選択」が選択可能であることを意味します)、if ステートメントは次のようにする必要があります。

if ($("#menucompare").prop("selectedIndex") !== 0) // with no quotes around zero
于 2012-05-17T20:31:18.017 に答える