最近在做一个网站的HTML文章发布功能，用到了HTML编辑器，这个是以Iframe为基础的编辑器（貌似网上大多的都是用iframe的）。却发现一个问题，IE下运行得好好的，在Firefox里却始终不能提交更新后的数据到服务器上，找了半天原因才发现原来是在iframe的onblur事件里面调了更新数据内容的方法，但firefox下却没有执行。
于是立马开始google了一把，发现遇到问题的不是我一个人，大量的人都是在问怎么解决firefox中触发blur和focus事件的问题。答案到是给了一大堆，却没一个靠谱的。有一种答案说是放到setInterval里去执行。
2 </iframe>
3
4 <script>
5 window.setTimeout( function(){alert(1); document.getElementById("AA").focus(); }, 0);
6 </script>
看了半天也没明白这到底是怎么回事，调试了一把发现在是在第一次运行的时候在setTimeout触发了后，确实触发了blur事件和focus事件，可是之后再通过鼠标点击想触发这两个事件也不行，看样子这两个事件是有机会触发的，也许是采用一般的方式不能吧。不过用setTimeout这种方式太鸡肋了，总不至于每次去调用setTimeout去触发吧，我要是知道什么时候去调setTimeout了还不如直接去调用事件处理函数更好点。这种方法也是被毙了。
再次深度GOOGLE，发现了一个老外写的如下代码：
2 function setit(){
3 if(document.all){
4 document.getElementById("myframe").attachEvent("onblur",dothis);
5 }else{
6 document.getElementById("myframe").contentWindow.addEventListener("blur",dothis,false);
7 }
8 }
9
10 function dothis(){
11 alert("blurred");
12 }
13 </script>
14
15 <body onload="setit()">
16 <iframe width="155" height="144" id="myframe"></iframe>
17 <input />
18 </body>
试了一下果真可以直接触发，效果跟在IE下的一样。回过头去分析了一下代码，发现firefox中原来iframe上的事件挂到了iframe中的contentWindow中去了，与真接在html元素里面写事件属性相比，IE可能把iframe上的事件关联到了contentWindow上了，可firefox却不是这样的，还是各是各的。这样带来的问题是firefox想要给iframe加事件只能够用脚本去加了。
本来以为IE和firefox中对iframe的事件这部分定义不一样，回头去再去看看了HTML4.0中关于iframe的定义，果真是iframe上面就没有任何事件的定义，看来是IE顺手给加上的。firefox号称最符合html标准，那么写在iframe上的“事件”没有任何响应，自然也是合情合理的。DHTML手册上有一句话，由于没有“window”元素，body 元素将作为下列 window 对象事件的宿主：onblur, onbeforeunload, onfocus, onload 和 onunload。可HTML4.0里面body是有这两个事件的，所以也就不难解释为什么用脚本给iframe的contentWindow挂上事件就可以触发了，实际上这个事件是来自于contentWindow里面的body元素。
事情到这里还算是比较满意了，可是想想就因为一个浏览器不兼容的问题导致我花了老半天时间，真的很窝火。
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· [AI/GPT/综述] AI Agent的设计模式综述