關於onchange事件在IE和FF下的表現及解決方法_javascript技巧

在最近做的一個專案中，有這麼一個功能點：頁面上有一個checkbox，當使用者選擇或取消選擇該checkbox時會向後台發送一個jsonp請求。當時的實現是為這個checkbox添加一個onchange事件，但結果卻出人意料，為此，我深入的研究了一下，發現了onchange事件在IE和FF下的表現存在著以下問題。

問題①：在FF下，當改變checkbox的選取狀態時，會馬上觸發onchange事件。但在IE下改變checkbox的選取狀態時，並不會馬上出發onchange事件，而是需要等待checbox失去焦點時該事件才會出發。

為了解決這個問題，我在checkbox的onclick事件裡加入了this.blur()這句話，這是由於onclick事件是在onchange事件之前執行的，因而在Onclick事件中加入this.blur()讓checkbox失去焦點馬上會出發onchange事件。但如此一來，又遇到了第二個問題。

問題②：當onclick事件和this.blur同時使用時，在IE下會報錯。

在網路上找了一些資料，終於發現了onpropertychange這個事件。該事件在FF下是不會觸發的。而在IE下，當checkbox的選擇狀態改變時馬上就會出發。於是，得出了最終的解決方案：在IE下，為checkbox綁定onpropertychange事件，而在FF下，為其綁定onchange事件。

具體程式碼實作如下：

複製程式碼 程式碼如下:

var🎜> 程式碼如下:

var s=null;
var browser={ 
  msie:(s=ua.match(/msies*([d.] )/))?s[1 ]:false, 
  firefox:(s=ua.match(/firefox/([d.] )/))?s[1]:false, 
  chrome:(s=ua.match(/chrome /([d.] )/))?s[1]:false, 
  opera:(s=ua.match(/opera.([d.] )/))?s[1]:false,
  safari:(s=ua.match(/varsion/([d.] ).*safari/))?s[1]:false 
};
if(browser.msie){/ /若為IE瀏覽器
    checkbox.onpropertychange=function(){
         //do someting
   >        //do something
    }
}