Javascript 如何比较select下拉选项与div类的值以切换可见性？

我有一个下拉列表，上面列出了国家，下面我有一个div，上面有mapuk，mapfr，mapes。现在更改下拉列表后，我想看看选择了哪个国家，并基于该国家显示特定的地图，该地图位于一个div中，其类等于dropdown的值

我正在尝试以下内容：

    $(function() {
    $("select").onchange(function() {
    if($(this).val() == //I need to compare the class of div that has map)
    {
   //show that map
//hide others
    }
    })
    })

有没有更好的选择。我不想这样做

$(function() {
    $("select").onchange(function() {
    if($(this).val() == "uk")
    {
    $(.map_uk).show();
    $(.map_fr,.map_es).hide()
    }

if($(this).val() == "fr")
    {
    $(.map_fr).show();
    $(.map_uk,.map_es).hide()
    }
blah blah blah
    })
    })

这个怎么样：

// #mapsHolder - div that contains all .map_* divs
$("select").onchange(function() {
    // hide all maps
    $('#mapsHolder > div').hide();
    // find a map with class ('.map_' + current value) which will turn into 'map_uk' etc
    $('#mapsHolder .map_' + $(this).val()).show();
});

---

只要值和类匹配，您就可以执行以下操作

$('.map_' + $(this).val())

---

选择相应的元素。

为元素创建常规类和特定类，如

class=“map-map\u-uk”

或

class=“map-map\u-es”

。所以，你可以这样做

$(function() {
    $("select").change(function() {
       $('.map').hide();
       $('.map_'+$(this).val()).show();        
    });
    $("select").change();
});

---

不确定您是否测试了当前的方法，但1）它是

.change

，2）选择器是字符串。我只是把我的方法放在这里。我没有完全复制粘贴我的代码，它只有在我点击其中一个下拉选项后才能工作。当我刷新页面时，我会看到所有三个divs@Mike当然可以。接下来，您需要在加载时触发

$（“选择”）.change（）

事件。谢谢，但不知道这有什么帮助。是否要与我共享该信息。@Mike如果更改了刚才选择的下拉列表索引，将调用该函数。在初始状态下，如刷新，将不会调用该函数。因此，所有

div

s都处于可见状态。因此，只需调用函数来读取dropbox的选定索引并隐藏

div

sthanks，但我仍然不知道在加载$（“select”）.change（）之后这会是什么；