Jquery Mobile允许相同页面转换-带有弹出窗口

我有允许在JQuery移动web应用程序中进行相同页面转换的配置

$(document).on('pageinit', function(){
    $.mobile.changePage.defaults.allowSamePageTransition = true;
});

它对我的下拉/弹出菜单产生问题

<a href="#page1" data-rel="popup" data-icon="grid" data-iconpos="notext">Option</a>

<div data-role="popup" id="page1">
    <ul data-role="listview" data-inset="true" data-theme="a">
        <li><a data-rel="dialog" href="#dialog1">Dialog 1</a></li>
        ...
    </ul>
</div>  

...

问题是在弹出窗口外单击会使页面变为空白。删除config

$.mobile.changePage.defaults.allowSamePageTransition=true解决了这个问题，但我想在我的JQM web应用程序中允许相同的页面转换

如何修复它？
您试图在错误的位置更改它，而不是它应该是：

$(document).on("mobileinit", function(){
    $.mobile.changePage.defaults.allowSamePageTransition = true;
});

基本上，对全局设置的任何更改都必须经过mobileinit事件，并且必须在初始化jQuery Mobile之前执行，请在此处阅读更多信息：

所以您应该像这样初始化它：

<script src="jquery.js"></script>
<script>
    $(document).on("mobileinit", function(){
        $.mobile.changePage.defaults.allowSamePageTransition = true;
    });
</script>
<script src="jquery-mobile.js"></script>


$（文档）.on（“mobileinit”，函数（）{
$.mobile.changePage.defaults.allowSamePageTransition=true；
});

编辑：

那你就需要作弊了。首先，您必须了解jQM弹出窗口可能是最有缺陷的jQM小部件

要解决您的问题，您应该防止在弹出窗口外触摸/单击时关闭弹出窗口（data dismissible=“false”）。要关闭它，您应该在弹出窗口的左上角/右上角添加无文本关闭按钮

工作JSFIDLE示例：
选择权

<div data-role="popup" id="page1" data-dismissible="false">
    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
    <ul data-role="listview" data-inset="true" data-theme="b" style="min-width:210px;">
        <li data-role="divider" data-theme="a">Popup API</li>
        <li><a data-rel="dialog" href="#dialog1">Dialog 1</a></li>
    </ul>
</div> 



弹出式API



编辑2:

另一个解决方案是切换到jQuery Mobile版本1.3.1