小编典典

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

ajax

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

<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加载内容?是否可以根据需要重用脚本来加载不同的内容?


阅读 230

收藏
2020-07-26

共1个答案

小编典典

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

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

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

jQuery('#dialog').load('path to my page').dialog('open');
2020-07-26