根据第一个下拉列表更改第二个下拉列表，并使用 php 和数组更改第二个下拉列表的第三个下拉列表 [关闭]

Posted 2023-05-09

【中文标题】根据第一个下拉列表更改第二个下拉列表，并使用 php 和数组更改第二个下拉列表的第三个下拉列表 [关闭]

【英文标题】：Change second drop down list depending on first drop down list and third drop down on second dropdown selection using php and arrays [closed]

【发布时间】：2014-11-16 08:50:20

【问题描述】：

我得到两个下拉示例，但我想要三个下拉示例

第一个下拉值被选中，第二个应该改变，第二个下拉后第三个应该改变，然后人会点击保存它会转到mysql数据库

请举个例子 我有一个，但它的 2 下拉

我已经尝试过这段代码，但它不是编写代码，因为如果我更改第一个 DD，其余两个也会更改

           ( http://jsfiddle.net/arunpjohny/nQBK2/)

html：

<select name="select1" id="select1">
    <option value="1">Item 1</option>
    <option value="2">Item 2</option>
    <option value="3">Item 3</option>
</select>
<select name="select2" id="select2">
    <option value="1">Item 1 second</option>
    <option value="2">Item 2 second</option>
    <option value="3">Item 3 second</option>
</select>
<select name="select3" id="select3">
    <option value="1">Item 1 third</option>
    <option value="2">Item 2 third</option>
    <option value="3">Item 3 third</option>
</select>

JQuery:

var $select2 = $('#select2'), $select3 = $('#select3');
$("#select1").change(function () 
    var id = $(this).val();

    if ($select2.data('options') == undefined) 
        $select2.data('options', $select2.find('option').clone());
    
    var options = $select2.data('options').filter('[value=' + id + ']');
    $select2.html(options);

    if ($select3.data('options') == undefined) 
        $select3.data('options', $select3.find('option').clone());
    
    var options = $select3.data('options').filter('[value=' + id + ']');
    $select3.html(options);
);

【问题讨论】：

虽然将jsFiddle 链接到您的问题是一种很好的做法，但建议您将代码的相关部分包含在问题正文中，因为jsFiddle 往往会经常下降，使得回答你的问题不可能。

这能解决您的问题吗？ jsfiddle.net/nQBK2/3

@Altaf Kadu 你能说上面的小提琴是否解决了你的问题，所以我可以把它作为答案吗？ :)

@Edward 在给定的示例中，每当我选择第一个 DD 时，其他两个 dd 也会发生变化，但实际上我希望第一个 dd 会改变第二个 dd 并且在选择第二个三分之一后会改变

好的，当你在这里提问时，你需要更清楚你想要完成的事情。请在下面查看我的答案。

【参考方案1】：

您可以通过按值选择选项来执行您所要求的操作： 您使用的过滤器功能正在删除除已选择的选项之外的所有选项。

find('option[value="' + i + '"]');

http://jsfiddle.net/nQBK2/4/

select1 = $('#select1');
select2 = $('#select2');
select3 = $('#select3');

$(select1).change(function() 
    var i = $(this).val();
    $(select2).find('option[value="' + i + '"]').prop('selected', true);
);

$(select2).change(function() 
    var i = $(this).val();
    $(select3).find('option[value="' + i + '"]').prop('selected', true);
);

【讨论】：

谢谢我现在知道了@edward