Question

我有一个数据库，我从中拉出一些状态，这是我从中得到的JSON：

["Arkansas","California","Connecticut","Florida"]

我有一个选项组中所有状态的列表，如下所示：

<select name="geoStates" id="geoStates" class="select2" multiple>
<option></option>
<optgroup label="United States">
    <option value="Alabama" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/5/5c/Flag_of_Alabama.svg/23px-Flag_of_Alabama.svg.png">Alabama</option>
    <option value="Alaska" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Flag_of_Alaska.svg/21px-Flag_of_Alaska.svg.png">Alaska</option>
    <option value="Arizona" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/9/9d/Flag_of_Arizona.svg/23px-Flag_of_Arizona.svg.png">Arizona</option>
    <option value="Arkansas" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/9/9d/Flag_of_Arkansas.svg/23px-Flag_of_Arkansas.svg.png">Arkansas</option>
    <option value="California" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/0/01/Flag_of_California.svg/23px-Flag_of_California.svg.png">California</option>

对于所有状态，有没有办法让我查看所有值，并根据选项的值检查我从数据库中返回的值？这是我从未做过的事情，所以这对我来说真的很棘手。：P

如果我需要添加任何内容，请询问。

Answer 1

我假设您已成功将从JSON接收的数组存储到JS数组中。如果是这种情况，您可以使用$.each()简单地遍历数组中的每个项目，假设它存储在名为data的变量中。在每次迭代期间，我们指示jQuery查找其值与data中的值匹配的选项，其中包含简单CSS attribute selector，option[value='...']。

// Just inserting data manually from your example. You should have fetched this with JSON instead
var data = ["Arkansas","California","Connecticut","Florida"];

// Iterate through array
$.each(data, function(index, value) {
    $('#geoStates option[value="'+value+'"]').prop('selected', true);
});

请参阅此处的概念验证小提琴：http://jsfiddle.net/teddyrised/k5sx7/

旁注：如果您要取消选择，请使用.prop()代替.attr();），只需使用第$obj.prop('selected', false);行，而不是{{1} }。

Answer 2

以这种方式：

selected = ["Arkansas","California","Connecticut","Florida"];

$("#geoStates option").each(function(elem) {
    if ($.inArray($(this).val(), selected) != -1) {
        $(this).prop('selected', true);    
    }
});

这是一个显示它的小人物

http://jsfiddle.net/sQD8q/

Answer 3

根据数组中的值设置选项的selected属性，您可以使用jQuery的$.inArray

进行检查

var states = ["Arkansas","California","Connecticut","Florida"];

$('#geoStates option').prop('selected', function() {
    return $.inArray(this.value, states) != -1;
});

FIDDLE

检查值和标记的jQuery搜索选项

3 个答案: