Javascript 从具有相同类名的Selected下拉列表中获取值

我有5个选项卡，显示了5个州的地理详细信息。在每个选项卡上都有一个下拉列表，列出这些州的主要城市。默认情况下，所有城市都设置为“总人口”，显示下拉列表下方的活人口。我有一个每3秒调用一次的函数。因此，当用户更改城市时，该城市的当前人口将显示在下面

在每个选项卡上，下拉列表都有类

.city

下面是每3秒调用一次的jquery函数

function doCity() {
    var feed =   $.ajax({
        type: 'POST',
        url: '<?php echo base_url('index.php')?>/feed/population',
        data: $('.city').val(),
              // dataType: 'json',
        success: function (feed) {
            $('.current_value_alaska').html(feed); 
            $('.current_value_block2').html(feed); 
            $('.current_value_block3').html(feed); 
            $('.current_value_block4').html(feed);  
        },
        complete: function (feed) {                       
            setTimeout(doCity, interval);
        }
    });
}

函数doCity（）{
var feed=$.ajax({
键入：“POST”，
url:“/feed/population”，
数据：$（'.city'）.val（），
//数据类型：“json”，
成功：功能（提要）{
$（'.current_value_alaska'）.html（提要）；
$（'.current_value_block2'）.html（提要）；
$（'.current_value_block3'）.html（提要）；
$（'.current_value_block4'）.html（提要）；
},
完成：函数（feed）{
setTimeout（doCity，interval）；
}
});
}

HTML

城市1
城市2
城市3
城市4
城市5
城市31
城市32
城市33
城市34
城市35

问题是，当我更改城市时，第一个选项卡上会显示正确的人口，并且每3秒更新一次。。。但在其他选项卡上，当我更改城市时，它不会显示所选城市的人口

---

有人能告诉我我做错了什么吗？

只需使用：selected pseudo获取所有选择的选项，并按值筛选它们。这是一个凉爽干净的衬里

$('.myclass option:selected').filter("[value=audi]")

之后，您可以在变量中获取该值，并检查长度是否大于0。（因此您有一个选定的奥迪选项）

由于在下拉列表更改时使用了

doCity（）

，因此需要以其他方式组织代码。将

onchange

事件添加到下拉列表中，并且只添加AJAX调用

您可以看到它正在工作，相同的代码如下：

var allTabSelectors=$（'.tab_选择a'）；
var allTabs=$（'.tab'）；
变量微调器=$（'.spinner'）；
$（'.tab_选择a'）。在（'click'，函数（e）{
e、 防止违约；
var thisLink=$（此）；
var thisref=thisLink.attr（'href'）；
allTabs.hide（）；
$（thisref.show（）；
allTabSelectors.removeClass（'active'）；
thisLink.addClass（'active'）；
});
$（'.tab_选择a:eq（0）'）。触发器（'click'）；
$（'.city'）。关于（'change'，函数（e）{
var thisSelect=$（此）；
var thisValue=thisSelect.val（）；
var thisTab=thisSelect.closest（'.tab'）；
var thisResult=thisTab.find（'.result'）；
spinner.show（）；
$.ajax({
键入：“post”，
url:“/echo/html/”，
数据：{
城市：这个价值，
html:我们发布了：“+thisValue+”
”
},
成功：功能（提要）{
html（feed）；
spinner.hide（）；
},
错误：函数（e）{
spinner.hide（）；
}
});
})

*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
字体系列：无衬线；
字体大小：16px；
}
h3，
p{
利润率：0.10px；
}
.tab_选择li{
显示：内联块；
边框：1px实心#000；
}
.tab_选择li a{
显示：块；
填充物：5px10px；
背景：无#ccc；
}
.tab\u选择li a.active{
背景：无#fff；
}
.标签{
边框：1px实心#000；
填充：10px 10px 0；
位置：相对位置；
}
斯宾纳先生{
显示：无；
位置：绝对位置；
左：0；
排名：0；
右：0；
底部：0；
宽度：100%；
背景：无rgba（0,0,0,5）中心；
}
.标签{
显示：无；
}
.标签：第一个孩子{
显示：块；
}

表1内容

选择城市
城市1
城市2
城市3
城市4
城市5


-结果来了

表2内容

选择城市
城市1
城市2
城市3
城市4
城市5


-结果来了

不是完整的代码集，您是如何调用doCity的？您是否对所有选项卡都有单独的表单？首先，使用

$（'.city'）。在（'change'）

事件上执行

设置超时是没有意义的。第二，给我们更多的代码（创建一个小提琴？）。第三，可能也是最重要的一点，当
$（'.city'）是一个jQuery对象数组时，您对
$（'.city'）.val（）
的回报是什么？由于您对类
city
有多个选择，因此来自
$（'.city'）.val（）
的ajax调用中的数据将仅具有第一个实例的值。您应该将每个
select
元素的值分别传递给doCity函数
$('.myclass option:selected').filter("[value=audi]")