Question

我正在开发一个jQuery Mobile网站，但我们没有使用AJAX转换（我们对整个网站都有$.mobile.ajaxEnabled = false。）

我有一个页面，我希望将其视为对话框，但这似乎只适用于启用AJAX。

有没有人找到一种方法让jQuery Mobile以这种方式处理像对话框这样的页面而不仅仅是设计一个看起来像对话框的页面？

Answer 1

jQuery Mobile框架显示文档中找到的第一个data-role="page"元素，它跳过data-role="dialog"个元素，因此您不能让文档中的第一个伪页面成为对话框（对话框会跳过对话框）初始负荷）。

然而，您可以手动将伪页面插入DOM，然后使用$.mobile.changePage()将新插入的页面显示为对话框：

//bind a `click` event handler to a link (to open the dialog)
$('#some-link-id').bind('click', function (event) {

    //prevent the default behavior of the link (an href of '#' would try to scroll to the top of the page, we want to prevent that behavior)
    event.preventDefault();

    //now to get the HTML to add to the DOM for the new dialog, for demonstration purposes I set the URL of the AJAX request to the `href` attribute of the link clicked
    $.get(this.href, function (serverResponse) {

        //append the server response to the `body` element, this should be a `data-role="dialog"` element and it's contents
        $('body').append(serverResponse);

        //now that the new dialog is appeneded to the DOM, transition to it using it's ID as a reference
        $.mobile.changePage($('#dialog-id'), { role : 'dialog' });
    });
});

以下是演示：http://jsfiddle.net/mVdVd/

请注意，serverResponse应该是一个完整格式的HTML代码块，以data-role="dialog"元素（ID为dialog-id）开头。

带有ajaxenabled = false的jquery移动对话框

1 个答案: