0

複数の選択リストが2つあります

<html><head></head>
<body>

<select name="cars" multiple="multiple" size="7">
  <option value="">-</option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

<select name="drivers" multiple="multiple" size="7">
  <option value="1">Luiza</option>
  <option value="2">Sebastian</option>
  <option value="3">John</option>
  <option value="4">Arthur</option>
  <option value="5">Staszek</option>
  <option value="6">Patryk</option>
  <option value="7">Lucas</option>
  <option value="8">Madlen</option>
  <option value="9">Bartek</option>
  <option value="10">Inter</option>
</select>
</body></html>

「車」に応じて「ドライバー」を選択する必要があります

たとえば、私がVolvoを選択するとき、それは実際にはLuiza、John、およびStaszekを選択する必要があります。saabを選択した場合、Arthur、Inter、Lucas、Patrykを選択している必要があります

それが不可能な場合は、「車」から選択した後、「ドライバー」を無効にし、「車」から「-」を選択すると、「ドライバー」が再びアクティブになります。

4

2 に答える 2

1

jQueryを使用すると、簡単に実行できます。

      $(document).ready(function (){
        $('#select-cars').change(function(){
            var car = $('#select-cars').val();
            // Uncheck ALL driver
            $('#select-drivers option').each(function (index, value) {
                $(this).removeAttr('selected');
            });
            // Check each driver in funcition of the car
            if (car == 'volvo') {
                //check Luiza etc
                $('#select-drivers option[value=1]').attr('selected', 'true');
            } else if (car == 'saab') {

            }

        });
    });
于 2012-05-19T09:37:54.620 に答える
1

これをajaxで行い、可能であればデータベースからデータをロードします。またはjqueryでこれを試してください

$(document).ready(function() {     
            $('#a2').attr("disabled", "disabled");
            $('#a1').change(function() {
                var str = "";
                $("#a1 option:selected").each(function () {
                    str += $(this).text() + " ";
                });
                if(str.trim()=="-")
                    $('#a2').removeAttr("disabled");
                else
                    $('#a2').attr("disabled", "disabled");
            });
 });

ケースのIDを「a1」、ドライバーを「a2」として指定します。

于 2012-05-19T09:41:42.170 に答える