-6

我的工作在 Firefox 和 Google Chrome 上运行良好，但在 IE 中无法运行。你能指出我哪里弄错了吗？

脚本.js

$(document).ready(function () {
    $('.delete').click(function () {
        var contentId = $(this).attr('contentid');
        $.confirm({
            'title': 'Delete Confirmation',
            'message': 'Are you sure you want to delete this record?',
            'buttons': {
                'Yes': {
                    'class': 'blue',
                    'action': function () {
                        DoDelete(contentId);
                    }
                },
                'No': {
                    'class': 'orange',
                    'action': function () {}
                    // Nothing to do in this case. You can as well omit the action property.
                },
                'close': {
                    'action': function () {}
                    // Nothing to do in this case. You can as well omit the action property.
                }
            }
        });
    });
});

生成 HTML 标记的确认脚本

(function ($) {
    $.confirm = function (params) {
        if ($('#confirmOverlay').length) {
            return false;
        }
        var buttonHTML = '';
        $.each(params.buttons, function (name, obj) {
            buttonHTML += '<a href="#" class="button ' + obj['class'] + '">' + name + '<span></span></a>';
            if (!obj.action) {
                obj.action = function () {};
            }
        });
        var markup = [
            '<div id="confirmOverlay">',
            '<div id="confirmBox">',
            '<div id="header">',
            '<div id ="title">',
            params.title,
            '</div></div>',
            '<div id ="textbox">',
            '<p>',
            params.message,
            '</p></div>',
            '<div id="confirmButtons">',
            buttonHTML,
            '</div></div></div>'
        ].join('');
        $(markup).hide().appendTo('body').fadeIn();
        var buttons = $('#confirmBox .button'),
            i = 0;
        $.each(params.buttons, function (name, obj) {
            buttons.eq(i++).click(function () {
                obj.action();
                $.confirm.hide();
                return false;
            });
        });
    }
    $.confirm.hide = function () {
        $('#confirmOverlay').fadeOut(function () {
            $(this).remove();
        });
    }
})(jQuery);
4

1 回答 1

1

首先，您的$('.delete')处理程序的第一行是：

var contentId = $(this).attr('contentid');

但你的标记.delete是：

<div class="delete"></div>

（注意缺少contentId属性）。幸运的是（？）您的代码实际上似乎没有使用contentId:-)

更相关的是，您需要确定代码的哪一部分正在破坏（如果您有代码的 JS Fiddle，我可以查看，但既然您没有，您必须自己找出来）。我会在调用alert之前放一个$.confirm，然后再在里面放一个$.confirm，以确保代码甚至可以到达您的插件（如果没有，那是您的问题）。

如果是，那么下一个要问的问题是“您的标记是被添加但没有被显示，还是根本没有被添加”。警报或 IE 开发人员工具都应该让您检查 DOM 并确定您的标记是否被添加；如果没有，那是你的问题。如果它正在被添加，但没有显示出来，那么fadeIn你的 出现了问题，这就是你的问题。

最后一点，有一种更简单的方法可以连接按钮事件；代替：

var buttons = $('#confirmBox .button'),
        i = 0;
$.each(params.buttons, function (name, obj) {
    buttons.eq(i++).click(function () {
        obj.action();
        $.confirm.hide();
        return false;
    });
});

你可以这样做：

$('#confirmBox .button').each(function(button) {
    $(button).click(function () {
        params.buttons[$(this).text()].action();
        $.confirm.hide();
        return false;
    });
});
于 2012-07-03T18:46:59.050 回答