jQuery Mobile自定义选择不关闭
我有一个使用jQuery 1.6.2和jQuery Mobile 1.0b3的Web应用程序。我需要显示一个选项列表，所以我使用了自定义选择。我不能通过使用标题按钮来关闭选择，也不能通过选择选项来关闭。
全局设置nativeMenu = false。 我使用
创建了选择 <select data-mini="true">
<option value="1">Option1</option>
<option value="2">Option2</option>
</select>
HTML看起来像这样（还有更多选项，因此选择全屏显示）：
<div data-role="dialog" data-theme="c" data-overlay-theme="a" tabindex="0"
class="ui-page ui-body-c ui-dialog ui-overlay-a ui-page-active" style="min-height: 480px;">
<div role="dialog" class="ui-dialog-contain ui-corner-all ui-overlay-shadow">
<div data-role="header" class="ui-corner-top ui-header ui-bar-a" role="banner">
<a href="#" data-icon="delete" data-iconpos="notext"
class="ui-btn-left ui-btn ui-shadow ui-btn-corner-all ui-btn-icon-notext ui-btn-up-a" data-corners="true"
data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="a" title="Close">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">Close</span>
<span class="ui-icon ui-icon-delete ui-icon-shadow"> </span>
</span>
</a>
<div class="ui-title"></div>
</div>
<div data-role="content" class="ui-corner-bottom ui-content ui-body-c" role="main">
<ul class="ui-selectmenu-list ui-listview" id="undefined-menu" role="listbox" aria-labelledby="undefined-button"
data-theme="c">
<li data-option-index="0" data-icon="false" class="ui-btn ui-btn-icon-right ui-li ui-btn-active ui-btn-up-c"
role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div"
data-iconpos="right" data-theme="c" aria-selected="true">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">Option1</a>
</div>
</div>
</li>
<li data-option-index="1" data-icon="false" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c" role="option"
data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right"
data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">Option2</a>
</div>
</div>
</li>
</div>
</div>
</div>
标题按钮适用于jQuery 1.8.3＆amp; jQm 1.2.1（选择一个选项仍然不起作用），但更改此版本会导致我的遗留应用程序出现其他问题，因此我更倾向于使用1.6.2＆amp; s的解决方案。 jQm 1.0。 任何想法为什么选择不起作用？
编辑： 经过几天的搜索，我发现对话框没有关闭，因为我已经设置了hashListeningEnabled = false。不幸的是，我无法改变这一点。我偶然发现了这个：https://github.com/jquery/jquery-mobile/issues/2285，但我无法升级jQm / jQuery版本。所以我离开时为选择找到了一些不错的选择。有什么建议吗？
1 个答案:
答案 0 :(得分：0)
哇......没有答案......差不多一年了！我有相同的（或实际上类似的......很快）问题。所以我在这里继续我的经验：
（我需要提一下，我可以选择多个项目，但是当我点击标题上的十字按钮时......不会有任何结束操作。所以DANG！
我一直试图为此设计某种解决方法..所以我开始改变其他一些jQm弹出窗口，我现在面临的问题是我的解决方案似乎显示了与html对象不同的按钮（每次你单击这一个按钮时，它会围绕SELECT的项目，在这一个按钮内一次显示一个，非常奇怪......至少对于我使用jquery mobile的新手体验，所以也许它很简单几个选项，我没有膝盖如何设置，但我对解决方案视而不见。
那么，我需要从常见的SELECT（HTML OBJECT）中显示一个像图片中的弹出窗口（也是下面粘贴的代码）的漂亮弹出窗口？
（请看看我打算做什么（外观和感觉） h t t p：/ / i。 s t a c k。我是你。 c o m /I5q0I.png
这是我应该拥有的代码（但是交叉工作，而不是。）
<div class="ui-popup-container ui-popup-active" id="select-choice-7458-listbox-popup" tabindex="0" style="max-width: 1825px; top: 2788.5px; left: 805.5px;">
<div id="select-choice-7458-listbox" class="ui-selectmenu ui-popup ui-body-a ui-overlay-shadow ui-corner-all">
<div class="ui-header ui-bar-c">
<h1 class="ui-title">
</h1>
<a href="#" class="ui-btn-left ui-btn ui-btn-up-c ui-shadow ui-btn-corner-all ui-btn-icon-notext" data-iconpos="notext" data-icon="delete" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="c" title="Close">
<span class="ui-btn-inner">
<span class="ui-btn-text">
Close
</span>
<span class="ui-icon ui-icon-delete ui-icon-shadow">
</span>
</span>
</a>
</div>
<ul class="ui-selectmenu-list ui-listview" id="select-choice-7458-menu" role="listbox" aria-labelledby="select-choice-7458-button" data-theme="c" data-divider-theme="b">
<li data-option-index="0" data-icon="checkbox-off" data-placeholder="true" class="ui-selectmenu-placeholder ui-btn ui-btn-up-c ui-btn-icon-right ui-li-has-arrow ui-li ui-first-child" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit"></a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
<li data-option-index="1" data-icon="checkbox-off" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-btn-up-c" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">
Scribbling</a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
<li data-option-index="2" data-icon="checkbox-off" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-btn-up-c" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">
Letter-like symbols</a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
<li data-option-index="3" data-icon="checkbox-off" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-btn-up-c" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">
Strings of letters</a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
<li data-option-index="4" data-icon="checkbox-off" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-btn-up-c" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">
Beginning sounds
</a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
<li data-option-index="5" data-icon="checkbox-off" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-btn-up-c" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">
Ending and medial sounds
</a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
<li data-option-index="6" data-icon="checkbox-off" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-last-child ui-btn-up-c" role="option" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-iconpos="right" data-theme="c" aria-selected="false">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" tabindex="-1" class="ui-link-inherit">
Conventional writing
</a>
</div>
<span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">
</span>
</div>
</li>
</ul>
</div>
</div>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？