Question

我的代码实际上在chrome中工作得很好，但在IE中测试失败：/ e.element（）。hide（）和e.element（）。insert（）不起作用。 Ajax.Request（）在两种浏览器中都运行良好。知道怎么解决吗？

$$('a.deleteButton').invoke('observe', 'click', function(e) {
            var commentID = parseInt(this.readAttribute('data-commentid'));
            e.stop();
            new Ajax.Request('index.php?action=CNewsComment',
                    {
                        method: 'POST',
                        parameters: {entryID: commentID, cNewsAction: 'delete'},
                        onSuccess: function(transport){
                            new Effect.toggle('commentID' + commentID, 'Appear', {duration:0.5});
                            var count = parseInt($('commentsCount').innerHTML.stripTags());
                            $('commentsCount').innerHTML = count-1;
                        },
                        onLoading: function(transport){
                            e.element().hide(); //not working in IE but in Chrome

                            if ($('deleteLoading' + commentID)) {
                                $('deleteLoading' + commentID).show();
                            }
                            else {
                                e.element().up().insert ({ 
                                    'before'  : '<img id="deleteLoading' + commentID + '" src="' + RELATIVE_WCF_DIR + 'images/cNewsSpinnerS.gif" alt="" />'
                                });
                            }
                        },
                        onFailure: function(transport){ 
                            e.element().show();                         
                            $('deleteLoading' + commentID).hide();                          
                            alert("An error occurred: " + transport.status + ' - ' + transport.statusText);
                        }
            });
    });

更新：如果我把不在IE中工作的代码放在AJAx-Request之外，它就可以了：

$$('a.deleteButton').invoke('observe', 'click', function(event) {
            event.stop();
            // IE PART START
            event.element().hide();
            if ($('deleteLoading' + commentID)) {
                $('deleteLoading' + commentID).show();
            }
            else {
                event.element().up().insert ({ 
                'before'  : '<img id="deleteLoading' + commentID + '" src="' + RELATIVE_WCF_DIR + 'images/cNewsSpinnerS.gif" alt="" />'
                });
            }
            // IE PART END
            new Ajax.Request('index.php?action=CNewsComment',
                    {
                        method: 'POST',
                        parameters: {entryID: commentID, cNewsAction: 'delete'},
                        onLoading: function(transport){
                        }

但是在onLoading-function中它不是，为什么？！

Answer 1

$$('a.deleteButton').invoke('observe', 'click', function(e) {
        var commentID = parseInt(this.readAttribute('data-commentid'));
        e.stop();
        new Ajax.Request('index.php?action=CNewsComment',
                {
                    method: 'POST',
                    parameters: {entryID: commentID, cNewsAction: 'delete'},
                    onSuccess: function(transport){
                        new Effect.toggle('commentID' + commentID, 'Appear', {duration:0.5});
                        var count = parseInt($('commentsCount').innerHTML.stripTags());
                        $('commentsCount').innerHTML = count-1;
                    },
                    onLoading: (function(transport, e){
                        e.element().hide(); //not working in IE but in Chrome

                        if ($('deleteLoading' + commentID)) {
                            $('deleteLoading' + commentID).show();
                        }
                        else {
                            e.element().up().insert ({ 
                                'before'  : '<img id="deleteLoading' + commentID + '" src="' + RELATIVE_WCF_DIR + 'images/cNewsSpinnerS.gif" alt="" />'
                            });
                        }
                    }).bindAsEventListener(this),
                    onFailure: function(transport){ 
                        e.element().show();                         
                        $('deleteLoading' + commentID).hide();                          
                        alert("An error occurred: " + transport.status + ' - ' + transport.statusText);
                    }
        });
});

Answer 2

试试这个：

    $$('a.deleteButton').invoke('observe', 'click', function(e) {
        var element = e.element();
        var commentID = parseInt(this.readAttribute('data-commentid'));
        e.stop();
        new Ajax.Request('index.php?action=CNewsComment', {
            method: 'POST',
            parameters: {entryID: commentID, cNewsAction: 'delete'},
            onSuccess: function(transport) {
                new Effect.toggle('commentID' + commentID, 'Appear', {duration:0.5});
                var count = parseInt($('commentsCount').innerHTML.stripTags());
                $('commentsCount').innerHTML = count-1;
            },
            onLoading: function(transport) {
                element.hide(); // not working in IE but in Chrome

                var delId = 'deleteLoading' + commentID;
                if ($(delId)) {
                    $(delId).show();
                } else {
                    element.up().insert({ 
                        'before': '<img id="' + delId + '" src="' + RELATIVE_WCF_DIR + 'images/cNewsSpinnerS.gif" alt="" />'
                    });
                }
            },
            onFailure: function(transport) { 
                element.show();                         
                $('deleteLoading' + commentID).hide();                          
                alert("An error occurred: " + transport.status + ' - ' + transport.statusText);
            }
        });
    });

如果此代码无效，请尝试使用以下变体替换onLoading：

            onLoading: function(element, transport) {
                element.hide(); // not working in IE but in Chrome

                var delId = 'deleteLoading' + commentID;
                if ($(delId)) {
                    $(delId).show();
                } else {
                    element.up().insert({ 
                        'before': '<img id="' + delId + '" src="' + RELATIVE_WCF_DIR + 'images/cNewsSpinnerS.gif" alt="" />'
                    });
                }
            }.curry(element),

P.S。你使用哪个IE版本？较旧的IE具有单个全局事件对象window.event，并且在异步回调时，即使在关闭时，e也可能指向不是您的原始点击事件，而是指向{{1}之前触发的另一个事件被调用了。

Answer 3

我只是对原型有所了解。但是如何调试以检查'e'是否是您要使用的元素。有时候我遇到了这样的问题。

$$（'a.deleteButton'）。调用（'观察'，'点击'，函数（e）在Internet Explorer中不起作用

3 个答案: