Html Safari iOS 7 中的多选
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20039194/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Multiple select in Safari iOS 7
提问by zacropetricopus
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.
当我在选择下拉列表中使用多个选项时 - safari 遇到了奇怪的问题。当我选择一个选项并说完成时，下拉列表会返回显示“0 项”。但是如果我选择多个选项（多个），除了第一个选项之外的所有选项都会被选中。在此之后，如果我取消选择所有选项，最后一个将保持选中状态。
Check this for a demousing safari on iOS 7.0.3.
在 iOS 7.0.3 上查看使用 safari的演示。
<select multiple="multiple">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>
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.
我看过http://www.thecssninja.com/html/optgroup-ios6，但它谈到了使用 optgroups 的问题——它（当与多个一起使用时）目前似乎完全使 safari 崩溃。
回答by Gromo
// 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 += '>« Select ' + (select.attr('title') || 'Options') + ' »';
firstOption += '</option>';
select.prepend(firstOption);
});
}
回答by Rodrigo Silva
Simple add:
简单添加：
<option disabled></option>
as the first element of multiple select.
作为多选的第一个元素。
回答by user756659
This has partly been fixed in 7.1 that was released the other day, however, there are still many issues. Item count is now correct, but...
这在前几天发布的 7.1 中已部分修复，但是，仍然存在许多问题。项目计数现在是正确的，但是...
you can select optgroup titles (you should not be able to do this, and if so, it should at least select/unselect the entire group.
if you disable an option
<option disabled="disabled">Computer 1</option>you can still select it which of course it totally wrong as well.
您可以选择 optgroup 标题（您不应该这样做，如果是这样，它至少应该选择/取消选择整个组。
如果您禁用一个选项，
<option disabled="disabled">Computer 1</option>您仍然可以选择它，当然这也是完全错误的。
Get it together Apple.
把它放在一起苹果。
回答by AronR
'Multiple select' bugs in Safari in iOS 7.0.3 on the iPhone have been reported by others, as well, on Apple's discussion forums; e.g.:
其他人也报告了 iPhone 上 iOS 7.0.3 中 Safari 中的“多选”错误，以及在 Apple 的论坛上；例如：
https://discussions.apple.com/message/23745665#23745665
https://discussions.apple.com/message/23745665#23745665
https://discussions.apple.com/message/23607781#23607781
https://discussions.apple.com/message/23607781#23607781
Since it's Apple that will need to fix this, the consensus approach for what you can do to help facilitate resolution of this issue, per posts on those two discussion threads, is to:
由于需要解决此问题的是 Apple，因此根据这两个讨论主题上的每个帖子，您可以采取哪些措施来帮助解决此问题的共识方法是：
- Look for existing bugs and, if necessary, file a new bug, via Apple's Bug Reporter.
- Join any existing discussion topic(s) about this in Apple's Developer Forums, and open a new topic if this has not yet been discussed. (The discussions above both took place in Apple's public forums, in the "Using iPhone" area, and as such might not necessarily be seen or responded to by Apple's Developer Support staff.)
- 查找现有错误，并在必要时通过 Apple 的错误报告器提交新错误。
- 在 Apple 的开发者论坛中加入任何关于此的现有讨论主题，如果尚未讨论过，请打开一个新主题。（以上讨论都发生在 Apple 的公共论坛上，在“使用 iPhone”区域，因此 Apple 的开发人员支持人员可能不一定会看到或回复。）
回答by Daniel Dewhurst
I seem to have come up with a fix with mysteriously works with jQuery. I imagine you could vanilla-ify the code if you don't want the jQuery dependency:
我似乎想出了一个解决办法，神秘地与 jQuery 一起工作。我想如果你不想要 jQuery 依赖，你可以对代码进行香草化：
/**
* iOS mutliple select fix.
*/
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
$('select[multiple]').each(function() {
$(this).prepend('<option disabled></option>');
$(this).append('<optgroup disabled></optgroup>');
});
}
