javascript - 带有 Iframe 的 Jquery 对话框在 IE9 中不起作用

Question

带有 Iframe 的 Jquery 对话框在 IE9 中不起作用。

我的parent.aspx 上有一个HTML 按钮

<input type="button" id="btnMessageFilter" class="mainFont" value="Message Filter"/>

单击“btnMessageFilter”时，我想在 Jquery 对话框中打开另一个 aspx 页面(child.aspx)；我是这样做的:

$(document).ready(function () {
    $("#btnMessageFilter").live('click', function () {
        var iframe = $("<iframe>").attr({
            "src": "MessageFilter.aspx?btn=btnRefresh",
            "height": "100%",
            "marginwidth": "0",
            "marginheight": "0",
            "scrolling": "auto",
            "frameborder": "0"
        });
        $("#dialog2").empty().append(iframe);
        $("#dialog2").dialog({
            modal: true,
            title: 'Message Filter',
            width: 400,
            height: 450
        });
        $("#dialog2").parent().appendTo('form');
        return false;
    });
});      

除了 IE9 之外，代码运行良好。有任何建议来修复上述 cod 或在 Jquery 对话框中打开另一个 aspx 的替代方法吗？

Answer 1

我不确定你的代码有什么问题。但我在网站的某些页面上使用 iframes + jQuery-ui 对话框，如下所示:

var iframe = $('<iframe frameborder="0" marginwidth="0" marginheight="0" allowfullscreen></iframe>');
var dialog = $("<div></div>").append(iframe).appendTo("body").dialog({
    autoOpen: false, // autoopen is set to false (we'll create only one dialog and open it on-demand)
    modal: true,
    resizable: false,
    width: "auto",  // set width and
    height: "auto", // height to auto (we'll set width/height on the content)
    close: function() {
        iframe.attr("src", ""); // load blank document in iframe
                                // can be useful in situations, for example,
                                // when your frame is playing audio or video
    }
});
$('#btnMessageFilter').click(function() {
    iframe.attr("width", 400).attr("height", 200); // set width/height on the content
    dialog.dialog("option", "title", "Message Filter").dialog("open");
    iframe.attr("src", "http://example.com");
});

Demo here