小编Tod*_*ert的帖子

我正在使用带有optgroups的select来在移动设备上进行一些导航.我使用optgroup的标签来表示它所属的部分 - 然后选项本身来指定子部分.

问题是,当select不在焦点时,我遇到的几乎所有浏览器都没有显示optgroup.我通过编写以下jQuery解决了这个问题:

$(".Nav-Interior-Mobile select option:selected").each( function() {
    pageGroupLabel = $(this).parent('optgroup').attr('label');
    pageItemLabel = $(this).text();
    $(this).text(pageGroupLabel + " > " + pageItemLabel);
});
$('.Nav-Interior-Mobile select').focus( function() {
    $(this).find('option:selected').text(pageItemLabel); 
});
$('.Nav-Interior-Mobile select').blur( function() {
    $(this).find('option:selected').text(pageGroupLabel + " > " + pageItemLabel); 
});

这似乎适用于除iOS之外的所有内容.在iOS中,更改选择的UI不会反映在焦点上使用的新文本.我可以看到Apple的UI改变之上的实际选择 - 但他们的UI根本没有改变.

任何人都知道如何做到这一点？

这里模糊时工作:

并且在专注时不工作(当它应该只是说"Web"时,他们的UI仍然具有"品牌> Web"):

这绝对是一个错误 - 如果你向下滚动然后在列表中备份 - 然后文本被更改 - 奇怪.