Question

我有3个下拉列表。 1）类型 2）持续时间 3）班级

<select name="passenger_type_of_pass" class="pass">
    <option value="">- - Type - -</option>
    <?
       $result_type_of_pass = myquery($type_of_pass);                                           
       while($row = mysql_fetch_array($result_type_of_pass))
       {
          echo "<option value=\"" . $row['product_name'] . "\">" . $row['product_name'] . "</option>";  
       }
    ?>
</select>

<select name="passenger_duration" class="duration">
    <option>--Duration--</option>
</select>

<select name="passenger_class" class="class">
    <option>--Class--</option>
</select>

使用jQuery，我会更新它们，因为每个选择框都有变化。

        $(".pass").change(function()
        {
            var pass=$(this).val();
            var dataString = 'pass='+ pass;

            $.ajax
            ({
                type: "GET",
                url: "duration.php",
                data: dataString,
                cache: false,
                success: function(html)
                {
                    $(".duration").html(html);
                }
            });

        });

        $(".duration").change(function()
        {
            var duration=$(this).val();
            var pass=$(".pass").val();
            var dataString = 'pass='+ pass + '&duration=' + duration;

            $.ajax
            ({
                type: "GET",
                url: "class.php",
                data: dataString,
                cache: false,
                success: function(html)
                {
                    $(".class").html(html);
                }
            });

        });

我希望以这样一种方式更改此代码：只要选择“type_of_pass”，就会填充“duration”下拉列表，并且top选项也会被选中！使用此自动选择的持续时间，用于搜索类的jQuery将运行并填充选定的顶级选项。

目前使用我的代码，我必须更改持续时间才能填充该类。

由于

Answer 1

在填充后更改事件，如

$('.duration').change():

<强> CODE：

$.ajax({
    type: "GET",
    url: "duration.php",
    data: dataString,
    cache: false,
    success: function(html) {
        $(".duration").html(html);
        $(".duration").change(); // here to trigger a change
    }
});

设置您可以执行的任何特定选项

$('.duration option:eq(1)').prop('selected', true); // here I set the second option

<强> DEMO

使用AJAX和jQuery自动选择下拉列表

1 个答案: