没有 ASP.NET 的动态下拉列表答案

【问题标题】：Dynamic dropdown list without ASP.NET没有 ASP.NET 的动态下拉列表
【发布时间】：2014-03-18 20:17:56
【问题描述】：

我想创建类似的东西：

3.bp.blogspot.com/-RlGu3mmu6jA/URJdWWtt9XI/AAAAAAADoU/ryaRZ3DKkzc/s1600/1.gif

但没有 ASP.NET。

这有可能吗？

【问题讨论】：

如果您只有几个可能的选项，那么您可以使用 javascript 轻松做到这一点。

标签： list dynamic

【解决方案1】：

正如其他人所说，您可以轻松使用 Javascript 等客户端代码。

这是一个使用 Javascript 和 jQuery 的示例：http://jsfiddle.net/ET5JW/9/

HTML：

<label for="firstBox">First Select</label>
<select id="firstBox">
    <option value="">Select Option...</option>
    <option value="a">A</option>
    <option value="b">B</option>
</select>
<br />
<div id="secondBox_frame" style="display:none;">
    <label for="secondBox">Second Select</label>
    <select id="secondBox">
        <option value="">Use first box first</option>
    </select>
</div>

Javascript（使用 jQuery）：

var options = new Array("a","b");
options["a"] = new Array("1a","2a","3a");
options["b"] = new Array("1b","2b","3b");

$("#firstBox").change(function(){
    if ($("#firstBox").val()) {
        $("#secondBox").html('');
        var selectedOptions = options[$("#firstBox").val()];
        for (var i in selectedOptions) {
            $("#secondBox").append('<option value="'+selectedOptions[i]+'">'+selectedOptions[i]+'</option>');                         
        }
        $("#secondBox_frame").fadeIn(400);
    }
    else {
        $("#secondBox").html('<option value="">Use first box first</option>');
        $("#secondBox_frame").fadeOut(400);
    }
});

如果你有兴趣做这个服务器端PHP 可以提供帮助。

【讨论】：

非常感谢，正是我所追求的。是否可以在使用第一个下拉列表后才显示第二个下拉列表？
@user3433505，我更新了它以包含您要求的显示/隐藏。

【解决方案2】：

这有可能吗？

是的，嗯……但是你想使用什么语言？你想要这样的网页（here）吗？还是在桌面程序中（例如java - swing）？安卓/iOS应用？

【讨论】：