DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> 關於onchange事件在IE和FF下的表現及解決方法
關於onchange事件在IE和FF下的表現及解決方法
編輯:JavaScript綜合知識     

 本篇文章主要是對關於onchange事件在IE和FF下的表現及解決方法進行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助

在最近做的一個項目中,有這麼一個功能點:頁面上有一個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 ua=navigator.userAgent.toLowerCase(); 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     } } else{     checkbox.onchange=function(){         //do something     } }  
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved