元素的内联事件处理函数的特殊作用域在各浏览(3)

附：在上述代码中，追加以下代码确认 'onsearch' 的位置：

<script> var o=document.getElementsByTagName("button")[0]; if("onsearch" in o)alert("当前对象有 onsearch 属性。"); if(o.hasOwnProperty("onsearch"))alert("onsearch 属性是当前对象私有。"); </script> 3.2. 在表单内的子孙级非表单元素的内联事件处理函数中试图调用表单的属性或方法时出现的问题

假设有以下代码：

<form action="xxx" method="get"> ... <a href="#">click</a> </form>

作者本意为点击 A 元素后调用 FORM 的 'submit' 方法，但 Chrome Firefox 并未将 FORM 对象加入到该内联事件处理函数的作用域链中，因此以上代码在 Chrome Firefox 中并不能正常运行。

解决方案

1. 尽量不要使用内联事件处理函数，使用 DOM 标准的事件注册方式为该元素注册事件处理函数，如：

<button> click here </button> <script> function onsearch(){ alert("Click!"); } function bind($target,eventName,onEvent){ $target.addEventListener?$target.addEventListener(eventName,onEvent,false):$target.attachEvent("on"+eventName,onEvent); } bind(document.getElementsByTagName("button")[0],"click",onsearch); </script>

2. 必须使用内联事件处理函数时，要保证该函数内试图访问的变量是位于全局作用域内的，而不会因该函数独特的作用域链而引用到非预期的对象。最简单的办法是使用前缀，如 'my_onsearch'。