在Safari iOS 7中多次选择 [英] Multiple select in Safari iOS 7

问题描述

当我在选择下拉菜单中使用多项选项时 - safari会出现奇怪的问题。当我选择一个选项并说完成时，下拉菜单会显示'0项目'。但是，如果我选择多个选项（多于一个），除第一个选项之外的所有选项都会被选中。之后，如果我取消选择所有选项，最后一个选项仍然处于选中状态。

When I use the multiple option in a select dropdown - safari runs into weird issues. When I select an option and say Done, the dropdown goes back to showing '0 items'. But if I select multiple options (more than one), everything except the first one gets selected. After this, if I unselect all options, the last one remains selected.

检查这是一个演示在iOS 7.0.3上使用safari。

Check this for a demo using safari on iOS 7.0.3.

<select multiple="multiple">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>

我看过http://www.thecssninja.com/html/optgroup-ios6 ，但是讨论了使用optgroups的问题 - 哪些（当与多个使用时）似乎完全崩溃了safari。

I've looked at http://www.thecssninja.com/html/optgroup-ios6, but that talks about issues with using optgroups - which(when used with multiple) currently seems to crash safari altogether.

推荐答案

    // hack for iPhone 7.0.3 multiselects bug
    if(navigator.userAgent.match(/iPhone/i)) {
        $('select[multiple]').each(function(){
            var select = $(this).on({
                "focusout": function(){
                    var values = select.val() || [];
                    setTimeout(function(){
                        select.val(values.length ? values : ['']).change();
                    }, 1000);
                }
            });
            var firstOption = '<option value="" disabled="disabled"';
            firstOption += (select.val() || []).length > 0 ? '' : ' selected="selected"';
            firstOption += '>&laquo; Select ' + (select.attr('title') || 'Options') + ' &raquo;';
            firstOption += '</option>';
            select.prepend(firstOption);
        });
    }

这篇关于在Safari iOS 7中多次选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！