IE8 中带有 JQuery UI 模态对话框的混合内容警告

发布于 2024-11-03 21:43:42 字数 1732 浏览 0 评论 0原文

我使用 JQueryUI 的对话框作为模态窗口，并使用此处概述的方法将另一个页面加载到模态窗口中： http://blog.nemikor.com/2009/08/07/creating-dialogs-on-demand/

模式窗口已生成（请参阅下面的代码），它在 Firefox 中运行良好，但在 IE8 中，我收到可怕的混合内容警告（该网站正在通过 HTTPS 提供服务，并且我在 Firebug 中的所有检查都显示所有内容都有相对路径并且都来自与生成模式的页面相同的站点，更令人沮丧的是混合内容警告，您应该能够对 IE 给出的提示回答“否”，然后它应该加载。混合的内容 - 但我得到的只是一个空白的模态窗口。奇怪的是，即使同一站点上的非生成模态（模态内容位于同一页面上的隐藏 DIV 中）工作得很好，它也不会将覆盖区域变为透明。在 IE 中并创建带有透明覆盖层的模式。

我将 JQuery 1.4.2 与 JQueryUI 1.8.2 结合使用，下面是我的模式窗口代码以及根据单击的 a href 获取内容的代码。

$('.actionlink').each(function() {
    var $dialog = $('<div></div>');
    var $link = $(this).one('click', function() {
        $dialog
        .load($link.attr('href') + ' #modalWrapper')
        .dialog({
            resizable: false,
            modal: true,
            //autoOpen: false,
            title: 'Printable Action Items',
            width: 700,
            height: 'auto',
            buttons: {
                "Close": function() {
                    $(this).dialog("close");
                }
            }
        });

    $link.click(function() {
        $dialog.dialog('open');

        return false;
        });
        return false;
    });
});

这里是提供要插入到模态窗口中的页面的 href：

<a href="https://#cgi.server_name#/matters/viewprintableactions.cfm?matterid=#matterid#&asserter=#urlencodedformat(asserter)#" class="actionlink"><img src="/images/page_alert.png" width="16" height="16" border="0"></a>

这样做的原因是页面上可能存在多个这样的链接，我需要为每个链接提供一个模态，但要单独执行一个查询以获取模式的信息（因此它位于另一个页面中）。我们也无法更改用户的浏览器设置以允许混合内容并避免这种情况（我希望）。

任何有建议或可以看到问题所在的人都将不胜感激！

原文

I'm using JQueryUI's Dialog as a Modal window, and loading another page into the modal window using the method outlined here: http://blog.nemikor.com/2009/08/07/creating-dialogs-on-demand/

The modal window is generated (see my code below), and it works great in Firefox, but in IE8, I get the dreaded mixed content warning (the site is being served up via HTTPS, and all my checks in Firebug show that everything has relative paths and is all coming from the same site as the page generating the modal. What's even more frustrating is with the mixed content warning, you're supposed to be able to answer 'no' to the prompt IE gives you, and then it should load the mixed content - but all I get is a blank modal window. It also strangely does not turn the overlay area transparent, even though non-generated modals (the modal contents are in a hidden DIV on the same page) on the same site work just fine in IE and create the modal with the transparent overlay.

I'm using JQuery 1.4.2 with JQueryUI 1.8.2, and below is my modal window code along with the code that gets the content based on the a href clicked.

$('.actionlink').each(function() {
    var $dialog = $('<div></div>');
    var $link = $(this).one('click', function() {
        $dialog
        .load($link.attr('href') + ' #modalWrapper')
        .dialog({
            resizable: false,
            modal: true,
            //autoOpen: false,
            title: 'Printable Action Items',
            width: 700,
            height: 'auto',
            buttons: {
                "Close": function() {
                    $(this).dialog("close");
                }
            }
        });

    $link.click(function() {
        $dialog.dialog('open');

        return false;
        });
        return false;
    });
});

And here's the href that provides the page to insert into the modal window:

<a href="https://#cgi.server_name#/matters/viewprintableactions.cfm?matterid=#matterid#&asserter=#urlencodedformat(asserter)#" class="actionlink"><img src="/images/page_alert.png" width="16" height="16" border="0"></a>

The reason for doing it this way is there can potentially be multiple links like this on the page, and I need to provide a modal for every one, but do a separate query to get the information for the modal (hence why it's in another page). We also cannot change the user's browser settings to allow for the mixed content and avoid this (I wish).

Anyone with advice or can see what the issue is here is greatly appreciated!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

胡大本事 2024-11-10 21:43:42

您确定整个生成的文档中的每个引用都是相对/https 的吗？不仅仅是 #modalWrapper 元素中的部分，而是整个内容。正如在此线程中进行调查的那样，load() 函数在应用选择器之前将通过 ajax 返回的整个页面加载到 documentFragment 中，这意味着整个文档必须经过浏览器的安全处理。