Thursday, June 3, 2010

DOM Events for HTML Radio Buttons

An interesting bug came up today, and it had to do with the way IE 8 processes DOM events differently than the other browsers.

Here's the scenario:

We were attaching to a radio button's onchange event to do some processing. When you click on an option, we show you a particular div relevant to your selected option. This worked just fine on Firefox and Chrome, but was wacky on IE8. It turns out that IE8 doesn't seem to fire the onchange DOM event until after the element *loses focus*, meaning that our divs didn't show up until we clicked somewhere else on the screen.

We fixed the issue by switching to the onclick event, which fires nicely, on the click, as you would expect, on all three browsers.

In summary: when you want to trigger something when a user selects one of your radio buttons, attach to the onclick event, and not the onchange event, which has variable behavior across browsers.

20 comments:

Anonymous said...

Habit is a second nature...................................................

黃峻帆 said...

精彩的部落格 要繼續加油 ..............................

淑慧 said...

仇恨是一把雙刃劍,傷了別人,也傷了自己..................................................................

Anonymous said...

被人揭下面具是一種失敗,自己揭下面具卻是種勝利。...............................................................

Anonymous said...

所有的資產,在不被諒解時,都成了負債.................................................................                           

Anonymous said...

知識可以傳授,智慧卻不行。每個人必須成為他自己。......................................................................

Anonymous said...

當一個人內心能容納兩樣相互衝突的東西,這個人便開始變得有價值了。............................................................

Anonymous said...

教育的目的,不在應該思考什麼,而是教吾人怎樣思考............................................................

Anonymous said...

夜光杯中飲美酒 蝸牛牆邊爬上架 新疆醉人馬奶子 青鳥銜之上金井............................................................

Anonymous said...

好文章給我好心情,謝謝分享~~............................................................

Anonymous said...

Look before you leap.............................................................

Anonymous said...

這不過是滑一跤,並不是死掉而爬不起來了。.......................................................

Anonymous said...

Good mind, good find...................................................

Anonymous said...

來看看你囉~blog很棒! ..................................................................

Anonymous said...

教育無他,愛與榜樣而已............................................................

Anonymous said...

生命如夏花洵爛;死如秋葉之靜美。.......................................................

Anonymous said...

It is easier to get than to keep it.......................................................................

Anonymous said...

Pen and ink is wits plough...................................................................

Anonymous said...

知識可以傳授,智慧卻不行。每個人必須成為他自己。............................................................

Anonymous said...

看著你的BLOG 好多朋友都回應 真厲害..................................................