在 jquery 移动 select 框中显示完整内容 data-native-menu=“false”

Question

如何在 jquery 移动设备中显示完整内容？我用了 Select 框：

<select data-native-menu="false">

<option>Monday</option>
<option>Sunday jnnj jnkn ikni nin iuniu niun uin iun in in io nono no no n oino  on i </option>
<option>Tuesday</option>

http://jsfiddle.net/8xusq/65/

Answer 1

首先给你的select一个ID：

<select data-native-menu="false" id="mySelect">...

对于 data-native-menu="false"，jQM 创建弹出窗口或对话框（取决于列表的长度和 space 可用）来显示选项。创建的弹窗或对话框的ID是select ID加上“-listbox-popup”或者加上"dialog".

因此您可以添加 CSS 以允许选项文本换行：

#mySelect-listbox-popup ul li a.ui-link-inherit, #mySelect-dialog ul li a.ui-link-inherit {
    white-space: normal;
}

Updated FIDDLE

在 jquery 移动 select 框中显示完整内容 data-native-menu=“false”

show full content in jquery mobile select box data-native-menu=“false”

android

jquery-mobile

jquery-mobile-popup