Question

我需要使用Jquery打开一个页面作为模态对话框。例如：我有2页说，Parent.aspx＆amp; Child.aspx，当我点击parent.aspx中的按钮/链接时，我需要在使用JQuery的模态对话框中打开child.aspx。也可以在父页面和子页面中进行回发。

Answer 1

function test(){
    openShadowBox("http://www.google.com", 400, 600, 'my google');
}
function openShadowBox(url, height, width, title){
    width = parseInt(width)+60;
    var horizontalPadding = 30;
    var verticalPadding = 30;
    $('<iframe id="cdt_shadowbox" src="' + url + '" frameBorder="0"/>').dialog({
        title: (title) ? title : 'CDT Shadowbox',
        autoOpen: true,
        width: width,
        height: height,
        modal: true,
        resizable: true,
        autoResize: false,
        closeOnEscape: true,
        //position: 'top',
        overlay: {
            opacity: 0.5,
            background: "black"
        }
    }).width(width - horizontalPadding).height(height - verticalPadding);
    $('html, body').scrollTop(0);  
}

Answer 2

我认为最简单的方法是在指向 Child.aspx 的对话框中使用iframe。

Answer 3

JQuery有一些用于创建带有页面的模态“弹出窗口”的选项，但是当我读到你的问题时，我认为你想在一个单独的浏览器窗口中打开一个页面，其中包含与原始页面的模态关系。 Javascript（Jquery）允许Window.Open。这将在新窗口中打开您的第二页，但是，它不会创建模态关系，也不会（我相信）可以。

Answer 4

有许多jquery插件可用于模态对话框，例如：

http://plugins.jquery.com/project/modaldialog

根据您正在寻找的用户体验，您可能要么需要在模式对话框中使用iframe，要么可能需要ajax调用来获取内容并将其加载到对话框中。

Answer 5

您可以使用iFrame或UpdatePanel.

模态对话框与任何其他页面元素没有什么不同。是什么让它看起来像“模态”只是简单的CSS而已。

您使用ASP.NET和jQuery所遇到的一个难点是，ASP.NET需要将所有内容都放在单个form标记内。由于jQuery不是专为ASP.NET设计的，因此它（及其插件）可能会或可能不会知道（或关心）这个。

例如，如果您使用simplemodal，它可以选择指定对话框附加到表单的哪个位置，您可以使用它来确保它在#aspnetform内，并且它应该像任何一样工作其他页面元素。

使用JQuery显示模态对话框实现

5 个答案: