Question

我在Firefox中遇到addEventListener的问题。我在我的网站上有一个iframe用于我自己构建的WYSIWYG区域。

我希望iframe看起来更像普通的textarea，所以我希望在焦点上围绕iframe边框。第一个tp（textpreview）就像这样（并且效果很好）：

var tp = document.getElementById('iframe-textpreview');
var iframe = tp;    

if(tp.contentDocument){ // normal
    tp = tp.contentDocument;
}
else if(tp.contentWindow){ // old IE
    tp = tp.contentWindow.document; 
}
//Open and close for Firefox
tp.open();
tp.close();
tp.designMode = 'on';

然后我尝试附加一个eventlistener并在事件触发时记录。这适用于Chrome，Opera和最新的IE浏览器，但不适用于Firefox：

//Doesn't work in Firefox
tp.body.addEventListener('focus', function(){ console.log('focus...')});
tp.body.addEventListener('blur', function(){ console.log('blur...')});

但这确实有用。

//Firefox
tp.body.onfocus = function(){ console.log('focus...')};
tp.body.onblur = function(){ console.log('blur...')};

我已经清除了Firefox上的缓存并尝试使用另一台计算机，仍然没有运气让第一个选项正常工作。

Answer 1

Firefox不会因为某种原因触发body元素上的事件处理程序，而是必须将事件处理程序附加到iframe本身或iframe中的实际元素。

关注iframe本身，而不是身体，似乎适用于所有浏览器

tp.addEventListener('focus', function(){ console.log('focus...')});
tp.addEventListener('blur', function(){ console.log('blur...')});

Firefox element.event有效但element.addEventlistener没有

1 个答案: