当前位置: 首页 > 面试题库 >

jQuery:通过Ajax加载模态对话框内容

西门安民
2023-03-14
问题内容

目前我的模态对话框是这样的

<html>
 <head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/humanity/jquery-ui.css" type="text/css" />
 </head>
 <body>
  <div id="dialog" title="Title Box">
   <p>Stuff here</p>
  </div>
  <script type="text/javascript">
   jQuery(
    function() {
     jQuery("#dialog")
      .dialog(
       {
        bgiframe: true,
        autoOpen: false,
        height: 100,
        modal: true
       }
      );
     jQuery('body')
      .bind(
       'click',
       function(e){
        if(
         jQuery('#dialog').dialog('isOpen')
         && !jQuery(e.target).is('.ui-dialog, a')
         && !jQuery(e.target).closest('.ui-dialog').length
        ){
         jQuery('#dialog').dialog('close');
        }
       }
      );
    }
   );
  </script>
  <a href="#" onclick="jQuery('#dialog').dialog('open'); return false">Click to view</a>
 </body>
</html>

加载的Div包含在同一页面中。显示对话框时,如何将div移至第二页并通过Ajax加载内容?是否可以根据需要重用脚本来加载不同的内容?


问题答案:

看看Nemikor的这篇博客文章,它应该做您想要的。

http://blog.nemikor.com/2009/04/18/loading-a-page-into-a-
dialog/

基本上,在调用“打开”之前,您首先要从另一页“加载”内容。

jQuery('#dialog').load('path to my page').dialog('open');


 类似资料:
  • 问题内容: 好的,所以我对ajax和从外部加载内容还很陌生,希望对我的问题有任何见解。 我目前有一个隐藏的div,它是空的,单击链接后应该在其中加载ajax内容。 我目前有一个链接列表,所有链接都具有相同的类,并且我想在单击空白div时进行幻灯片切换,然后从链接要访问的页面中加载内容。 链接: 当前的jQuery: 刚接触Ajax并加载外部内容时,我想知道如何从位于标签中的链接页面加载内容。因此,

  • 问题内容: 我正在创建一个浏览大量图片的应用程序。至此,项目的那部分完成了,它对正确的图片进行了排序,过滤和加载,甚至将它们拆分为单独的页面以加快加载速度。 效果很好,但每页加载25张图片仍需要8秒钟以上。我已经进行了一些研究,得出的结论是,使用异步jQuery Ajax请求是最好的方式,以便尽可能快地同时加载所有请求。 到目前为止,这是我的代码: 此代码的问题在于,除了带有灰色边框的空白方形外,

  • 问题内容: 在此页面上,我有一个jQuery弹出窗口和可调整大小的缩略图。如果我将鼠标悬停在缩略图上,则图像的大小将完美调整。另外,当我单击页脚中的黄色大电视按钮“ QuickBook TV”时,弹出窗口会按照我的意愿完美显示。 但是,当我单击“下一步”或“上一步”按钮时,将使用AJAX加载新内容,而jQuery不再对弹出窗口或缩略图起作用。我搜索了许多论坛来寻找有关此问题的信息,但是由于对jQu

  • 问题内容: 我喜欢jQueryUI的对话框。但是,似乎没有一种动态加载内置内容的方法。我想我必须使用其他方法来实现这一目标?iframe仅在可见时才会加载内容吗?这是正确的方法吗? 如果其他对话框机制更适合仅在首次打开时加载内容,则我愿意接受。 问题答案: 这并非难事-仅此而已,我不会开始与iframe搞混。这样的事情怎么样? 基本上,您创建对话框,然后打开对话框,从服务器中加载一个html文件,

  • 模态对话框(Modal Dialog)与非模态对话框(Modeless Dialog)的概念不是 Qt 所 独有的,在各种不同的平台下都存在。又有叫法是称为模式对话框,无模式对话框等。 所谓模态对话框就是在其没有被关闭之前,用户不能与同一个应用程序的其他窗口进 行交互,直到该对话框关闭。对于非模 态对话框,当被打开时,用户既可选择和该对话框进 行交互,也可以选择同应用程序的其他窗口交互。 在 Qt

  • 问题内容: 如您在这里看到的,我有一个启动模态的按钮。设置按钮的href网址,该网址会由Bootstrap 3自动加载到模式中。事实是,此页面已加载到模式根中(如引导3文档中有关模式使用的内容所述)。我想将其加载到模态主体中。 有没有一种方法可以通过属性(不是javascript)做到这一点?或最自动的方法是什么? PS:我记得在Bootstrap 2中,内容已加载到主体中,而不是根中。 问题答案