Question

我有一个像这样创建的Mootools资产：

// Create a new asset
var asset = new Asset.image(path, {
    title: this.language.download,
    events: {click: this.download.bind(this, link)},
});

我有一个MooTools对象的方法定义如下：

download: function(e) { 
    // The path to download
    console.log('download: ' + e);
},

在Firefox中，console.log打印出现。然而，在IE8中，我没有运气。我错过了什么吗？

任何提示或建议将不胜感激。 TIA！

Answer 1

鉴于通过电子邮件进一步沟通......以及问题是由cpojer（mootools核心团队）使用filemanager mootools plugin引起的，我正在更新我对通过也是电子邮件。

有问题的源代码：http://github.com/cpojer/mootools-filemanager/raw/master/Source/FileManager.js - 第408行是问题

原始代码可能失败的原因（在IE8中），但我认为它无论如何都不安全 - 是mootools中的事件是每个元素驱动的UID。 I.E. - 如果你注入一个元素或通过选择器传递它并可能通过新的Element（）类（tbc）创建它，它会为它分配一个UID，对应哪个元素存储是启用。原始表单中使用的链接可能导致addEvent在元素存在之前运行，这会导致它失败。这里的问题是，当我进行的所有测试似乎都起作用时，它为什么不能附加事件。基本上，Asset.image代码是：

var image = new Image();
var element = document.id(image) || new Element('img');
element.store("foo", "bar");
alert(element.retrieve("foo") || "failed");

这个DOES分配一个UID并使其可用于事件，甚至在它是DOM的成员之前。 tescase：http://fragged.org/dev/ie8-new-image-bug.php - 为你输出'bar'吗？如果是这样的话，没有理由怀疑由于存储而导致事件分配顺序与DOM插入有关，这可能是一个完全操纵问题/ onclick问题。

无论哪种方式，您都可以尝试使用此替换类中的代码，尽管我还没有对其进行测试：

var _this = this;
icons.push(new Asset.image(this.options.assetBasePath + 'disk.png', {
    title: this.language.download
    "class": 'browser-icon',
    onload: function() {
        // once the src has been set and image loaded
        // inject into DOM (hence open to manilulations) and then add the event
        this.inject(el, 'top').addEvent('click', function(e) {
            _this.tips.hide();
            e.stop();
            window.open(_this.options.baseURL + _this.normalize(_this.Directory + '/' + file.name));
        });
    }
}));

还要考虑：IE已经 - 在过去 - 已知有加载缓存图像的问题，如果事件的分配错误，则无法触发事件：

// wrong:
var image = new Image();
image.src = 'image.jpg';
image.onload = function() { // evil, won't work if image already cached, it won't trigger
...
};

// right:
var image = new Image();
image.onload = function() { // always fires the event.
...
};
image.src = 'image.jpg';

这只是一个线索，mootools确保正确的插入顺序与事件分配 - 但这并不意味着IE8没有其他与事件类似的问题。

Answer 2

我尝试使用所描述的两种方法实现这一点。似乎在兼容模式的IE8或IE8中都不起作用。

var path = this.options.assetBasePath + 'disk.png';
var _this = this;
var icon = new Asset.image(path, {
                          /*onload: function() {
                    this.set({
                    title: _this.language.download,
                    events: {click: function() {
                                           alert('test');
                    }
                 }
            }).inject(el, 'top');
              }*/
       });
icon.set({title: _this.language.download,
     events: {click: function() {
                 alert('test');
                 }
         }
});
icon.inject(el, 'top');
icon.addClass('browser-icon');
icons.push(icon);

这两种方法都在FF中显示alert（），但在IE中失败。

MooTools事件未在IE8中触发

2 个答案: