jQuery的:通过Ajax加载模态对话框内容 [英] jQuery: Load Modal Dialog Contents via Ajax

查看:800
本文介绍了jQuery的:通过Ajax加载模态对话框内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

Currently my Modal Dialog is like this

<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到第二个页面并加载通过Ajax的内容会显示在对话框的时候?我可以重复使用的脚本加载不同的内容,根据需要?

The Div that is loaded is included in the same page. How do I move that div to a second page and load the contents via Ajax when the dialog is shown? And can I reuse the script to load different contents as per need?

推荐答案

请从Nemikor这篇博客文章,这应该做你想要的。

Check out this blog post from Nemikor, which should do what you want.

<一个href="http://blog.nemikor.com/2009/04/18/loading-a-page-into-a-dialog/">http://blog.nemikor.com/2009/04/18/loading-a-page-into-a-dialog/

基本上,叫开放,则加载从其他网页内容之前先。

Basically, before calling 'open', you 'load' the content from the other page first.

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

这篇关于jQuery的:通过Ajax加载模态对话框内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆