ajax 如何从 javascript 打开 jQuery Mobile Dialog?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6230460/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-06 11:01:27  来源:igfitidea点击:

How to open a jQuery Mobile Dialog from javascript?

ajaxpostdialogpopupjquery-mobile

提问by Will Curran

I have a dialog page and am trying to open it and display results from an AJAX POST.

我有一个对话框页面,正在尝试打开它并显示来自 AJAX POST 的结果。

Here is my jQuery success event:

这是我的 jQuery 成功事件:

success: function(resp) {                               
  $("#dialog").dialog();
  $("#text").html('SPAM and EGGS!')
}       

My HTML has two pages, the second being the dialog html:

我的 HTML 有两个页面,第二个是对话框 html:

<div data-role="page" id="main">
  # content 
</div>
<div data-role="page" id="dialog">
  <div data-role="header">
    <h1>Your Message</h1>
  </div>    
  <div data-role="content" id="text">
  </div>    
</div>

My AJAX POST is working and element id="text" is being updated with "SPAM and EGGS!", but the dialog is not popping up.

我的 AJAX POST 正在运行,元素 id="text" 正在更新为“SPAM 和 EGGS!”,但没有弹出对话框。

回答by Tombart

I think that this one is much more elegant:

我认为这个更优雅:

$.mobile.changePage('#dialog', 'pop', true, true);

you should have in your html data-role="dialog"instead of page

你应该在你的 htmldata-role="dialog"而不是page

<div data-role="dialog" id="dialog">...</div>

回答by codef0rmer

Add <a>tag anywhere in your page, just put your dialog's id as href as shown below: <a id='lnkDialog' href="#dialog" data-rel="dialog" data-transition="pop" style='display:none;'></a>

<a>在页面中的任意位置添加标签,只需将对话框的 id 设为 href,如下所示: <a id='lnkDialog' href="#dialog" data-rel="dialog" data-transition="pop" style='display:none;'></a>

And replace $("#dialog").dialog();inside your success event with $("#lnkDialog").click();

$("#dialog").dialog();在您的成功事件中替换为 $("#lnkDialog").click();

回答by Joseph Anderson

This answer also works:

这个答案也有效:

    $.mobile.changePage('#myPage', {transition: 'pop', role: 'dialog'});   

回答by Ahmet Mehmet

if it is not important to use "dialog" or "popup", try this:

如果使用“对话框”或“弹出窗口”并不重要,请尝试以下操作:

$("#dialog").popup('open');

回答by Grumpy

correct way with latest query version

使用最新查询版本的正确方法

$.mobile.changePage("#dialog", { transition: "pop",role: "dialog" })

回答by brixenDK

As of JQM 1.4 the changePagehas been deprecated, and will be removed in 1.5 (http://api.jquerymobile.com/jQuery.mobile.changePage/)

从 JQM 1.4 开始,它changePage已被弃用,并将在 1.5 ( http://api.jquerymobile.com/jQuery.mobile.changePage/) 中删除

They suggest that one should use the change()method of pagecontainerinstead.

他们建议应该使用 的change()方法pagecontainer

$.mobile.pageContainer.pagecontainer("change", "#dialog", { transition: 'pop', role: "dialog" });