-4

3 つの同一のドロップダウンがあります。drop1 から値を選択し、その値を drop2 から除外したいと考えています。次に、drop3 の選択から 1 と 2 を除外する必要があります。何かアイデアはありますか?

<select name="drop1">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
<select name="drop2">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
<select name="drop3">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
4

2 に答える 2

0

PHP または AJAX にどれだけ慣れているかに応じて、2 つの解決策があります。PHP に慣れている場合は、ユーザーに 1 つの選択フォームからデータを送信してもらい、次のような if ステートメントを使用することができます。

if $value != '1'{ 
echo '<option value="1">1</option>'; 
}

2 番目のフォームの各フィールドに対してそれを行います。次に、それを 3 番目のフォームに複製します。

よりスムーズに見えるソリューションは、AJAX を使用してリスナーを使用して、ユーザーがフィールドをクリックしたときに Java 値がそのフィールドとして設定されていることを確認し、java-script 変数で同様の「if then show」メソッドを使用して、含まれるフィールドを非表示にすることです。その値を他の形式に変換します。

また、最も簡単な解決策の1つは、複数選択を許可することです（1つのフォームを使用する外観に問題がなく、フォーム間の値が上記の例と同じであると仮定します）...その例は次のとおりです。

<select id="my_num" name="my_num" size="5" multiple="multiple" >
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
于 2013-01-07T20:11:35.650 に答える
0

change イベントを使用して、選択した要素を dom から削除できます

$('select[name=drop1]').change(function() {
    var drop2 = $('select[name=drop2]').empty().hide();
    var exclude = $(this).val();
    var size = $(this).children().length;
    for (var i=0; i<size; ++i) {
        if (i != exclude) {
           drop2.append('<option value="' + i + '">' + i + '</option>';
        }
    }
});

より複雑な例があり、値ベースの除外が必要な場合は、クローンを作成できます。

var clone = $('select[name=drop2]').clone();
$('select[name=drop1]').change(function() {
    var copy = clone.clone();
    copy.find('option[value=' + $(this).val() + ']').remove().end();
    $('select[name=drop2]').replaceWith(copy);
});
于 2013-01-07T20:19:32.653 に答える