FF IE兼容性的修改小結(jié)
更新時(shí)間:2009年09月02日 01:24:44 作者:
FF IE兼容性的修改小結(jié),大家以后在javascript的編寫過程中需要注意下。
1.html 標(biāo)簽如果用 $(id) 或者 getElementById 這兩個(gè)方法取值時(shí),要給該標(biāo)簽加上 id 的屬性, IE 、 FF 才兼容。如 $(mobile): 如果填 寫 mobile 的 input 沒有 id 屬性在 FF 中會(huì)報(bào)這個(gè)變量 undefined ;
2. 取 form 表單的某個(gè)標(biāo)簽對(duì)象,如果要 IE 、 FF 兼容要把 formMain.item 改為 document.formName.item 。
如 form1.webUrl 改為 document.form1.webUrl 。
如果 form 作為一個(gè)參數(shù)傳給某個(gè)函數(shù),也要加上 "document.", 如 search(formMain) 改為 search(document.formMain)
3. 取 html 的自定義屬性用 obj.attributeName 改為 obj.getAttribute("attributeName") 取則 IE 、 FF 兼容;非自定義屬性仍可以按照
obj.attributeName 取。
如: <input type="text" name="memberCn" checkValue="notNull;eLength:25"> 這個(gè)標(biāo)簽中的 checkValue 屬性為自定義屬性,要用 obj.getAttribute("checkValue") 取, IE 、 FF 才兼容,其他屬性如 type 屬性則仍然可以用 obj.type 取
4.eval 函數(shù),在 FF 和 IE 中使用不一樣 , 在 FF 中用“ + ”連接成的一個(gè)可執(zhí)行語(yǔ)句作為 eval 的參數(shù)時(shí),不能執(zhí)行而在 IE 中可以。遇到 要用 eval 時(shí),盡量找別的方法代替。
如: eval("msg_" + textbox.name+ “ .className='wrong' ”) ;
"msg_" + textbox.name+ “ .className='wrong' ”這句話作為 eval 的參數(shù)在 IE 中能執(zhí)行,在 FF 中執(zhí)行時(shí)報(bào) "msg_" + textbox.name 連接得到的空間名 undefined ,不能執(zhí)行, 要修改為:
document.getElementById("msg_" + textbox.name).className='wrong';
5. 樣式中的 display 的屬性 block ,在 FF 中如果遇到異??梢宰?yōu)榭眨蝗?item.style.display="block" 可以改為 item.style.display=""
如 $("divType4").style.display="block";
改為 $("divType4").style.display="";
6. 再添加一個(gè): label 在 FF 中好像跟 IE 不一樣:比如說以下代碼:
<td colspan = "3" class = "line_l"> 成人 <label>
<input name = "amount" type = "text" value = "${amount} " size = "6" maxlength = "10" eleName = "[ 成人預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" />
人 兒童
<input name = "kidAmount" type = "text" value = "${kidAmount} " size = "6" maxlength = "10" eleName = "[ 兒童預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" />
人 <span class = "line_red"> * </ span></label>
</ td>
這樣寫在 FF 中輸入時(shí)兒童的光標(biāo)總是跑到成人那里去, IE 中不會(huì),而這樣寫就不會(huì):
<td width = "25%"> 成人 <label>
<input name = "amount" type = "text" value = "${amount} " size = "6" maxlength = "10" eleName = "[ 成人預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" /> 人 </ label></ td>
<td width = "75%"> 兒童 <label><input name = "kidAmount" type = "text" value = "${kidAmount} " size = "6" maxlength = "10" eleName = "[ 兒童預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" /> 人 </ label></ td>
注意 label 的位置,一個(gè)是在兩個(gè) input 的外面,一個(gè)是在一個(gè) input 的外面,
難道 label 標(biāo)簽在 FF 中不能包含兩個(gè)輸入的標(biāo)簽???
還有一個(gè)地方:代碼如下:
<td><label>
<select name = "provinceId" id = "provinceId" onchange = "iniCity(document.frmMain.provinceId,document.frmMain.cityId,document.frmMain.subCity);" eleName = "[ 所在省份 ]" checkValue = "IS_LONG">
</ select> 省
<select name = "cityId" id = "cityId" onchange = "iniSubCity(document.frmMain.provinceId,document.frmMain.cityId,document.frmMain.subCity);" eleName = "[ 所在城市 ]" checkValue = "IS_LONG"></ select> 市
<select name = "subCity" id = "subCity" eleName = "[ 所在縣區(qū) ]" checkValue = "IS_LONG"></ select>
<span class = "red"> * </ span></label></ td>
這個(gè)代碼時(shí)第二個(gè),第三個(gè) select 的光標(biāo)固定不住,應(yīng)該是跑到了第一個(gè) select 上去了,但因?yàn)槭?select 所以看不到,但是上面的 input 能看到。同樣這個(gè)問題在 IE 中正常。我覺得這個(gè)也說明了我上面的說法。
2. 取 form 表單的某個(gè)標(biāo)簽對(duì)象,如果要 IE 、 FF 兼容要把 formMain.item 改為 document.formName.item 。
如 form1.webUrl 改為 document.form1.webUrl 。
如果 form 作為一個(gè)參數(shù)傳給某個(gè)函數(shù),也要加上 "document.", 如 search(formMain) 改為 search(document.formMain)
3. 取 html 的自定義屬性用 obj.attributeName 改為 obj.getAttribute("attributeName") 取則 IE 、 FF 兼容;非自定義屬性仍可以按照
obj.attributeName 取。
如: <input type="text" name="memberCn" checkValue="notNull;eLength:25"> 這個(gè)標(biāo)簽中的 checkValue 屬性為自定義屬性,要用 obj.getAttribute("checkValue") 取, IE 、 FF 才兼容,其他屬性如 type 屬性則仍然可以用 obj.type 取
4.eval 函數(shù),在 FF 和 IE 中使用不一樣 , 在 FF 中用“ + ”連接成的一個(gè)可執(zhí)行語(yǔ)句作為 eval 的參數(shù)時(shí),不能執(zhí)行而在 IE 中可以。遇到 要用 eval 時(shí),盡量找別的方法代替。
如: eval("msg_" + textbox.name+ “ .className='wrong' ”) ;
"msg_" + textbox.name+ “ .className='wrong' ”這句話作為 eval 的參數(shù)在 IE 中能執(zhí)行,在 FF 中執(zhí)行時(shí)報(bào) "msg_" + textbox.name 連接得到的空間名 undefined ,不能執(zhí)行, 要修改為:
document.getElementById("msg_" + textbox.name).className='wrong';
5. 樣式中的 display 的屬性 block ,在 FF 中如果遇到異??梢宰?yōu)榭眨蝗?item.style.display="block" 可以改為 item.style.display=""
如 $("divType4").style.display="block";
改為 $("divType4").style.display="";
6. 再添加一個(gè): label 在 FF 中好像跟 IE 不一樣:比如說以下代碼:
<td colspan = "3" class = "line_l"> 成人 <label>
<input name = "amount" type = "text" value = "${amount} " size = "6" maxlength = "10" eleName = "[ 成人預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" />
人 兒童
<input name = "kidAmount" type = "text" value = "${kidAmount} " size = "6" maxlength = "10" eleName = "[ 兒童預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" />
人 <span class = "line_red"> * </ span></label>
</ td>
這樣寫在 FF 中輸入時(shí)兒童的光標(biāo)總是跑到成人那里去, IE 中不會(huì),而這樣寫就不會(huì):
<td width = "25%"> 成人 <label>
<input name = "amount" type = "text" value = "${amount} " size = "6" maxlength = "10" eleName = "[ 成人預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" /> 人 </ label></ td>
<td width = "75%"> 兒童 <label><input name = "kidAmount" type = "text" value = "${kidAmount} " size = "6" maxlength = "10" eleName = "[ 兒童預(yù)訂人數(shù) ]" checkValue = "notNull;eLength:10;isLong" /> 人 </ label></ td>
注意 label 的位置,一個(gè)是在兩個(gè) input 的外面,一個(gè)是在一個(gè) input 的外面,
難道 label 標(biāo)簽在 FF 中不能包含兩個(gè)輸入的標(biāo)簽???
還有一個(gè)地方:代碼如下:
<td><label>
<select name = "provinceId" id = "provinceId" onchange = "iniCity(document.frmMain.provinceId,document.frmMain.cityId,document.frmMain.subCity);" eleName = "[ 所在省份 ]" checkValue = "IS_LONG">
</ select> 省
<select name = "cityId" id = "cityId" onchange = "iniSubCity(document.frmMain.provinceId,document.frmMain.cityId,document.frmMain.subCity);" eleName = "[ 所在城市 ]" checkValue = "IS_LONG"></ select> 市
<select name = "subCity" id = "subCity" eleName = "[ 所在縣區(qū) ]" checkValue = "IS_LONG"></ select>
<span class = "red"> * </ span></label></ td>
這個(gè)代碼時(shí)第二個(gè),第三個(gè) select 的光標(biāo)固定不住,應(yīng)該是跑到了第一個(gè) select 上去了,但因?yàn)槭?select 所以看不到,但是上面的 input 能看到。同樣這個(gè)問題在 IE 中正常。我覺得這個(gè)也說明了我上面的說法。
相關(guān)文章
JavaScript顯示當(dāng)前文檔最后修改日期的方法
這篇文章主要介紹了JavaScript顯示當(dāng)前文檔最后修改日期的方法,實(shí)例分析了javascript中document.lastModified的使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-03-03
js前端加密庫(kù)Crypto-js進(jìn)行MD5/SHA256/BASE64/AES加解密的方法與示例
js加密解密可以使用crypto-js它可以進(jìn)行MD5、SHA-1、SHA-256、Base64、AES、DES、等算法和加密,這是一個(gè)對(duì)稱加密的庫(kù),可以使用 AES、DES、但沒有rsa等非對(duì)稱加密的方法2023-12-12
js實(shí)現(xiàn)左側(cè)網(wǎng)頁(yè)tab滑動(dòng)門效果代碼
這篇文章主要介紹了js實(shí)現(xiàn)左側(cè)網(wǎng)頁(yè)tab滑動(dòng)門效果代碼,涉及JavaScript頁(yè)面元素的遍歷及元素屬性動(dòng)態(tài)切換的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
快速解決FusionCharts聯(lián)動(dòng)的中文亂碼問題
這篇文章主要介紹了如何解決FusionCharts聯(lián)動(dòng)的中文亂碼問題。需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12
Angular組件拿不到@Input輸入屬性問題探究解決方法
最近在工作中實(shí)現(xiàn)一個(gè)feature的時(shí)候,碰到一個(gè)小問題:Angular組件拿不到@Input輸入屬性的問題,盡管對(duì)這些問題都比較了解,但是找問題是需要一個(gè)過程的,所以還是把這個(gè)問題總結(jié)記錄了下2023-01-01
JS實(shí)現(xiàn)一個(gè)列表中包含上移下移刪除等功能
一個(gè)項(xiàng)目,包括了一個(gè)列表頁(yè)其中包括在列表中實(shí)現(xiàn)上移,下移,刪除等功能,為了用戶體驗(yàn),操作均使用JS實(shí)現(xiàn)2014-09-09

