使用GeoPlugin设置选定选项

Question

我正在使用http://geoplugin.net插件来检测用户的位置。我有一个带有状态列表的<select>，并使用jQuery

$.getJSON(url, function(data){
    var state = data['geoplugin_region'];
    $('#states').val(state).attr('selected',true);
    var selectId = "#" + state ;
    var citySelect = selectId + "-cities";
    $(citySelect).show();
});

然后，它使用我编写的另一个插件来显示正确的选择，其中包含该州的城市。我的格式是select id是华盛顿的WA-cities。

然后我写了这个：

var detectedCity = data['geoplugin_city'];
var city = detectedCity.replace(" ","-");
var selectedCity = city.toLowerCase();
var stateDash = state + "-";
var selectedValue = stateDash + selectedCity;
$(citySelect).val(selectedValue).attr('selected',true);

但是，当检测到不在select中的城市时，它只返回第一个值。如何检查城市是否在选择中，然后仅在选择城市时才选择它。我的选择是这样设置的(对于华盛顿)：

<select name="cities" id="WA-cities" class="cities">
    <option value="" selected="selected" disabled>Select a City</option>
    <option value="WA-bellingham">Bellingham</option>
    <option value="WA-seattle">Seattle</option>
</select>

实际上，在选择中有更多的城市。但我在默瑟岛被发现，那不在选择之列。JavaScript说是$(citySelect).val('WA-mercer-island).attr('selected',true);，但只是选择了贝灵汉岛，因为那里没有默瑟岛。我该怎么办？

Answer 1

$(citySelect).val(selectedValue).attr('selected',true);

这并不意味着“设置哪个值=selectedValue的选项”。这是错误的。

这是正确的方式，

$(citySelect + 'option[value="'+selectedValue+'"]').attr('selected',true);

here is a jsFiddle Example