使用jQuery显示/隐藏下拉列表,基于值

时间:2021-11-11 20:37:26

I'm trying to build a custom dropdownlist wich show/hide a second set of dropdowns based on it's selection.

我正在尝试构建一个自定义下拉列表,根据它的选择显示/隐藏第二组下拉列表。

I was wondering if anyone here might be able to help with a solution to this.

我想知道这里是否有人可以帮助解决这个问题。

You can view my code at http://jsfiddle.net/prodac/stAAm/

您可以在http://jsfiddle.net/prodac/stAAm/查看我的代码

1 个解决方案

#1


7  

use the jquery :selected a little bit of documentation is here http://api.jquery.com/selected-selector/

使用jquery:在这里选择了一些文档http://api.jquery.com/selected-selector/

That works in an option select menu

这适用于选项选择菜单

I am updating your Jfiddle now if you can give me a little more info about what you want done.

我现在正在更新你的Jfiddle,如果你能给我一些关于你想做什么的更多信息。


Edit

编辑

Here is an updated jfiddle with your answer. http://jsfiddle.net/stAAm/7/

这是一个更新的jfiddle与你的答案。 http://jsfiddle.net/stAAm/7/

and a copy of the code for Stack overflow

和Stack溢出代码的副本

$('#source').change(function () {
        if ($('#source option:selected').text() == "France"){
            $('.cities').hide();
            $('#source2a').show();
        } else if ($('#source option:selected').text() == "Germany"){
            $('.cities').hide();
            $('#source2b').show();
        } else if ($('#source option:selected').text() == "India"){
            $('.cities').hide();
            $('#source2c').show();
        } else {
            $('.cities').hide();
        } }); 

#1


7  

use the jquery :selected a little bit of documentation is here http://api.jquery.com/selected-selector/

使用jquery:在这里选择了一些文档http://api.jquery.com/selected-selector/

That works in an option select menu

这适用于选项选择菜单

I am updating your Jfiddle now if you can give me a little more info about what you want done.

我现在正在更新你的Jfiddle,如果你能给我一些关于你想做什么的更多信息。


Edit

编辑

Here is an updated jfiddle with your answer. http://jsfiddle.net/stAAm/7/

这是一个更新的jfiddle与你的答案。 http://jsfiddle.net/stAAm/7/

and a copy of the code for Stack overflow

和Stack溢出代码的副本

$('#source').change(function () {
        if ($('#source option:selected').text() == "France"){
            $('.cities').hide();
            $('#source2a').show();
        } else if ($('#source option:selected').text() == "Germany"){
            $('.cities').hide();
            $('#source2b').show();
        } else if ($('#source option:selected').text() == "India"){
            $('.cities').hide();
            $('#source2c').show();
        } else {
            $('.cities').hide();
        } });