跳到主要內容

發表文章

目前顯示的是 十一月, 2016的文章

disabled 元素 (element) 跟 滑鼠事件 (click event) 的問題

W3C HTML5 規格 :
4.10.19.5 Enabling and disabling form controls: the disabled attribute A form control that is disabled must prevent any click events that are queued on the user interaction task source from being dispatched on the element. 

disabled element 本身不會發出 click event ,而多數瀏覽器會把這事件往父元素送,但 firefox 不會(這個行為似乎沒有規格),因此要注意。
<divonClick="console.log(event.target)"><inputtype="text"disabled="disabled"onClick="console.log(event.target)"/></div><divonClick="console.log(event.target)"><inputtype="text"onClick="console.log(event.target)"/></div> 以上的例子,在 Chrome 中,點擊第一個 <input> ,只有 div 的 event listener 會印出一次訊息,但 even.target 仍然是 input。
點擊第一個 <input>, input 跟 dive 的 event listener 都會印出訊息。
在 Firefox 中,就什麼都不會印出,因為 event 不會往父元素傳播。
相關討論:
http://stackoverflow.com/questions/3100319/event-on-a-disabled-input