当前位置: 首页 > 图文教程 > 网络编程 > Javascript > FF IE兼容性的修改小结

Javascript
Javascript 学习笔记 错误处理
Javascript 类的继承实现代码
JavaScript 创建对象和构造类实现代码
JavaScript 学习小结(适合新手参考)
extjs 列表框(multiselect)的动态添加列表项的方法
javascript getElementsByName()的用法说明
Document 对象的常用方法
JS 事件冒泡 示例代码
JS 面向对象的5钟写法
JS 输入字数判断实现代码
Javascript 汉字字节判断
JavaScript 关键字屏蔽实现函数
一句话JavaScript表单验证代码
利用javascript实现一些常用软件的下载导航
jQuery 相关控件的事件操作分解
JavaScript 异步调用框架 (Part 1 - 问题 & 场景)
JavaScript 异步调用框架 (Part 2 - 用例设计)
JavaScript 异步调用框架 (Part 3 - 代码实现)
JavaScript 异步调用框架 (Part 4 - 链式调用)
JavaScript 异步调用框架 (Part 5 - 链式实现)

Javascript 中的 FF IE兼容性的修改小结


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 189 ::
收藏到网摘: n/a

FF IE兼容性的修改小结,大家以后在javascript的编写过程中需要注意下。 1.html 标签如果用 $(id) 或者 getElementById 这两个方法取值时,要给该标签加上 id 的属性, IE 、 FF 才兼容。如 $(mobile): 如果填 写 mobile 的 input 没有 id 属性在 FF 中会报这个变量 undefined ;
2. 取 form 表单的某个标签对象,如果要 IE 、 FF 兼容要把 formMain.item 改为 document.formName.item 。
如 form1.webUrl 改为 document.form1.webUrl 。
如果 form 作为一个参数传给某个函数,也要加上 "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"> 这个标签中的 checkValue 属性为自定义属性,要用 obj.getAttribute("checkValue") 取, IE 、 FF 才兼容,其他属性如 type 属性则仍然可以用 obj.type 取
4.eval 函数,在 FF 和 IE 中使用不一样 , 在 FF 中用“ + ”连接成的一个可执行语句作为 eval 的参数时,不能执行而在 IE 中可以。遇到 要用 eval 时,尽量找别的方法代替。
如: eval("msg_" + textbox.name+ “ .className='wrong' ”) ;
"msg_" + textbox.name+ “ .className='wrong' ”这句话作为 eval 的参数在 IE 中能执行,在 FF 中执行时报 "msg_" + textbox.name 连接得到的空间名 undefined ,不能执行, 要修改为:
document.getElementById("msg_" + textbox.name).className='wrong';
5. 样式中的 display 的属性 block ,在 FF 中如果遇到异常可以变为空;如 item.style.display="block" 可以改为 item.style.display=""
如 $("divType4").style.display="block";
改为 $("divType4").style.display="";
6. 再添加一个: label 在 FF 中好像跟 IE 不一样:比如说以下代码:
<td colspan = "3" class = "line_l"> 成人 <label>
<input name = "amount" type = "text" value = "${amount} " size = "6" maxlength = "10" eleName = "[ 成人预订人数 ]" checkValue = "notNull;eLength:10;isLong" />
人 儿童
<input name = "kidAmount" type = "text" value = "${kidAmount} " size = "6" maxlength = "10" eleName = "[ 儿童预订人数 ]" checkValue = "notNull;eLength:10;isLong" />
人 <span class = "line_red"> * </ span></label>
</ td>
这样写在 FF 中输入时儿童的光标总是跑到成人那里去, IE 中不会,而这样写就不会:
<td width = "25%"> 成人 <label>
<input name = "amount" type = "text" value = "${amount} " size = "6" maxlength = "10" eleName = "[ 成人预订人数 ]" checkValue = "notNull;eLength:10;isLong" /> 人 </ label></ td>
<td width = "75%"> 儿童 <label><input name = "kidAmount" type = "text" value = "${kidAmount} " size = "6" maxlength = "10" eleName = "[ 儿童预订人数 ]" checkValue = "notNull;eLength:10;isLong" /> 人 </ label></ td>
注意 label 的位置,一个是在两个 input 的外面,一个是在一个 input 的外面,
难道 label 标签在 FF 中不能包含两个输入的标签???
还有一个地方:代码如下:
<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 = "[ 所在县区 ]" checkValue = "IS_LONG"></ select>
<span class = "red"> * </ span></label></ td>
这个代码时第二个,第三个 select 的光标固定不住,应该是跑到了第一个 select 上去了,但因为是 select 所以看不到,但是上面的 input 能看到。同样这个问题在 IE 中正常。我觉得这个也说明了我上面的说法。