Question

我希望能够打开一个jQuery UI对话框并重定向到单个链接上的新页面。有没有办法做到这一点？

这是我的对话框处理程序：

$.fx.speeds._default = 1000;
    $(function() {
        $( "#dialogDiv" ).dialog({position:['middle',60],
            open: function(event, ui) {  
            jQuery('.ui-dialog-titlebar-close').removeClass("ui-dialog-titlebar-close").html('<span style="float:right;"><img src="../images/x.png" /></span>');  
        },  
            dialogClass: 'ui-widget-shadow',
            modal: true,    
            autoOpen: false,
            width: '950px',
            close: function(ev, ui) {$(this).close();}
        });

        $( ".opener" ).click(function() {
            $( "#dialogDiv" ).dialog( "open" );
            return false;
        });
        $( ".btnDone" ).click(function(){
            $('.ui-dialog-content').dialog( "close" );
        })
    });

这是我目前使用的链接（它打开模态窗口很好，但不会重定向到页面）：

<a href="newpage.html" class="button opener">View</a>
<div style="display:none;" id="dialogDiv" title="Your custom page">
</p>Here is your new custom dashboard</p>
<br />
<a href="#" class="btnDone button">OK</a>
</div>

因此，当用户单击“查看”按钮时，他们将看到在后台加载的新页面以及位于其上的模态对话框。如何调整代码才能使其正常工作？

Answer 1

试试这个： - http://jsfiddle.net/adiioo7/tURMc/1/

您可以使用iframe并显示弹出窗口，iframe将加载href网址。因此，弹出窗口将打开，所需页面将在iframe中打开。

HTML更改： -

<iframe id="testiframe" height="400" width="400" border="0"></iframe>

JS改变： -

$(".opener").click(function () {
        $("#dialogDiv").dialog("open");
        $("#testiframe").attr("src",$(this).attr("href"));
        return false;
    });

打开模态窗口并使用一个链接重定向到新页面

1 个答案: