javascript - 使用 Materialise css FW 预选多个选择框的选项不起作用

Question

我正在使用 Materialise CSS 框架。当我打印多个选择框 ( <select multiple>... ) 时，预选选项 ( <option selected...> ) 将不会呈现。 然而，浏览器知道某些选项是预先选择的，因此在提交表单时会再次发送它们。另外，由于渲染问题，我无法使用预选选项进行操作或选择新选项。

普通选择框工作得很好。

Answer 1

您可以将 onchange 事件添加到字段并通过访问所有 (li) 子项来重置值。如果你仔细看的话。多重选择使用 UL 和文本字段来存储值，并为 li 保留“Active”类。并在 .material select 之后附加此代码，因为复选框在此之后初始化

您可以尝试关注

function change_materialize_multiple_Select(id_of_select)
{
    var newValuesArr = [],
            select = $(id_of_select),
            ul = select.prev();
        ul.children('li').toArray().forEach(function (li, i) {
            if ($(li).hasClass('active')) {
                newValuesArr.push(select.children('option').toArray()[i].value);
            }
        });
        select.val(newValuesArr);   
}