Question

我在ColorBox中调用内联html，它在IE8中没有显示任何内容。这可以在Jack Moores自己的网站上复制。只需转到演示站点http://www.jacklmoore.com/colorbox/example1/，然后单击第二个到最后一个链接“内联HTML”。然后单击底部链接以更新内容...在IE8中，该框没有显示任何内容。

我遇到了同样的问题，但我正在动态创建div集合，如下所示。它用于复选框确认。有什么建议吗？

  $('input[name$=chkApproved]').click(function (e) {
            var th = $(this);
            if (th.is(':checked')) {
                var dialog = '<div">'
                + '<div id="dialog">'
                + '<p style="margin-top: 30px;">'
                + 'Are you sure you want to approve this program?</p>'
                + '<p style="font-size: small;">'
                + '<strong>Note:</strong> This cannot be undone!</p>'
                + '<p style="text-align: center;">'
                + '<a href="#" onclick="javascript:parent.$.colorbox.close();" class="btn btn-small btn-primary">Approve</a>'
                + '&nbsp;&nbsp;&nbsp;&nbsp;'
                + '<a href="#" onclick="' + $(this).attr('id') + '.checked=false;parent.$.colorbox.close(); return false;" class="btn btn-small">Cancel</a>'
                + '</p></div></div>';

                $.colorbox(
                {
                    onLoad: function() {
                        $("#cboxClose").remove();
                    },
                    overlayClose: false,
                    href: dialog,
                    open: true,
                    title: "Program Approval",
                    inline: true,
                    height: "210px",
                    onClosed: function () {
                        $("[id$=btnHiddenApprove]").click();
                    }
                });
                e.stopPropagation();
            } else {

                th.attr('checked', false);

            }
        });

Answer 1

我页面上的问题是链接断开。只是修复了，所以它应该不是问题。这不是IE8特有的，我对IE8没有任何麻烦。

我发布的唯一问题是您在开始<div>元素中有一个迷路引号。我在IE8中检查了你的内容，这确实是问题所在：

此：

var dialog = '<div">'

应该是这样的：

var dialog = '<div>'

迷路引号会使您的标记形成不正确，并且由浏览器决定如何响应或从错误中恢复，留下非常不一致的结果。

Answer 2

以下是有兴趣的修改后的代码....此代码将在复选框中显示确认，如果选择取消则取消选中。 onClosed事件触发一个隐藏的按钮单击事件，该事件通过gridview并设置任何选中的复选框。

function UnCheckBox(cb) {
        //alert(cb);
        $('#' + cb + '').removeAttr('checked');
    }
    $(document).ready(function () {

        $('input[name$=chkApproved]').click(function (e) {
            var th = $(this);
            if (th.is(':checked')) {
                var dialog = '<div>'
                + '<div id="dialog">'
                + '<p style="margin-top: 30px;">'
                + 'Are you sure you want to approve this program?</p>'
                + '<p style="font-size: small;">'
                + '<strong>Note:</strong> This cannot be undone!</p>'
                + '<p style="text-align: center;">'
                + '<a href="#" onclick="javascript:parent.$.colorbox.close();" class="btn btn-small btn-primary">Approve</a>'
                + '&nbsp;&nbsp;&nbsp;&nbsp;'
                + '<a href="#" onclick="UnCheckBox(\'' + $(this).attr('id') + '\'); parent.$.colorbox.close(); return false;" class="btn btn-small">Cancel</a>'
                + '</p></div></div>';

                $.colorbox(
                {
                    onLoad: function() {
                        $("#cboxClose").remove();
                    },
                    href: dialog,
                    open: true,
                    title: "Program Approval",
                    inline: true,
                    height: "210px",
                    onClosed: function () {
                        $("[id$=btnHiddenApprove]").click();
                    }
                });
                e.stopPropagation();
            } else {

                th.attr('checked', false);

            }
        });

在IE8中没有显示Colorbox和内联html

2 个答案: