removeAttr("selected")和.attr('selected','selected')无法正常工作

Question

我在表单中有两个选择字段，第一个是单选，第二个是多选。现在我想根据单选选择的选项选择多选中给定数据的选项。

为了实现这一点，当单选被更改时，我会触发一个ajax请求：

$.ajax({
    type : 'POST',
    url : '/Controller/getMultipleSelectIds',
    data : {
        singleSelectId: singleSelectId
    },
    success : function(data) {
        var multipleSelectIds= JSON.parse(data);
        $("#multipleSelectFieldId option:selected").prop("selected", false);
        $("#multipleSelectFieldId  option").each(function()
        {
            if ($(this).val() in multipleSelectIds) {
                $(this).attr('selected','selected');
            }
        });
        $("#multipleSelectFieldId").trigger("chosen:updated");
    }
});

假设我在数据库中有像这样的值，用于单选ID：

假设我在数据库中有类似以下的值，用于单选ID：

array(
  "ssId1" => array(1,2,4,5),
  "ssId2" => array(1,3,5)
)

现在我选择单选框中的第一个条目（“ssId1”），一切正常，这意味着多选框会像应该的那样填充（使用给定值1,2,4和5的选项）。但是当我再次更改单选框以选择另一个选项（“ssId2”）时，所选的选项仅显示选项3（这是不属于“ssId1”的一个值）。这种情况一直持续到我在所选的多选框中没有更多选项为止。

我已经检查了隐藏的多选框字段中的选项设置正确。现在问题是：这是chosen插件中的错误还是我做错了什么？

编辑 尝试找出问题，因此使源选择可见。似乎removeAttr或.prop("selected", false)甚至.attr('selected'，'selected')存在问题。当我在两个单选框选项之间切换时，只有选项3被标记（蓝色背景），但所有3个选项在html代码中都具有选中属性。当我尝试通过js / jquery在IE 11中选择多选（必填）字段中的所有选项并提交表单时，我遇到了类似的问题，IE说没有选择任何选项。我做错了什么？

- MrSmith

---

你能创建一个fiddle吗？如果我们能看到它的实际运行情况，那将会容易得多。 - StudioTime

以最简单的方式实现：链接 - MrSmith

在 func1 和 func2 之间切换三次后，所有项目都具有 html 属性 selected。 - MrSmith

Answer 1

只需在所有句子中使用prop()方法，该方法适用于像selected这样的动态属性。

请查看已修改无问题的代码片段：

https://jsfiddle.net/0aaxk2hz/3/

$(this).prop('selected', true); // add it
$(this).prop('selected', false); // remove it

- Marcos Pérez Gude

---

太好了！运行良好，我之前使用了 $(selector).remoceAttr('selected') 和 $(selector).attr('selected')。但是在这段代码之后，我遇到了一个问题，选择器不再显示正确的选项7。 - mdBender