IE/Firefox中JS脚本常见兼容问题
1、document.form.item/document.ID
IE中 document.formName.item(”itemName”)
FF中 document.formName.elements["elementName"]
建议使用document.getElementById(itemName)
2, 下标运算
IE中 document.forms(”formName”)
FF中 document.forms["formName"]
IE中 document.getElementsByName(”inputName”)(1)
FF中 document.getElementsByName(”inputName”)[1]
建议使用[]作为下标运算
3,window.event
IE中 可以使用window.event
FF中 event 只能在事件发生的现场使用,可以改写成 事件=函数(event);
function somemethod(evt) {
evt = evt ? evt : (window.event ? window.event : null);
alert(evt);
}
例如: <input onclick=somemethod(event)>
4,event.x 与 event.y 问题
IE中,event 对象有 x, y 属性
FF中,可用event.clientX ,event.clientY替代(IE也有该属性)
也可用:mX = event.x ? event.x : event.pageX;
5,操作frame
IE中 可以用window.FrameName取得该frame，FF中不行
FF中 可以用window.top.document.getElementById(”frameId”)来访问frame
注:IE 和FF都可以通过window.top.document.getElementById(”Frame”).src = ’somefile.htm’来切换frame的 内容,也都可以通过window.top.frameName.location = ’somefile.htm’来切换frame的内容
6,调用showModalDialog
IE中可以用showModalDialog一个子窗口,并获得返回值.
FF中没有showModalDialog,但可以用window.open来实现.
例如:
在Main.cfm文件中有如下代码:
function ShowItemList(Obj){
if (document.all){//IE
var ReturnValue=window.showModalDialog(”ItemList.cfm?Id=341″,”self”,”dialogwidth:500px;status:false”);
if (typeOf(ReturnValue)!=’undefined’){
Obj.value=ReturnValue;
}
}
else{
var subwin=window.open(Item.cfm?id=341,’newWin’,’modal=yes,width=500px’);
}
}
function ReturnValue(ReturnValue){
Obj=document.getElementById(’elementname’);
Obj.value=ReturnValue;
}
如果需要得到返回值.需要用到window.open的参数modal=yes,而且必须在子窗口中向母窗口传值(window.opener).
例如在subwin.cfm中加入以下代码:
function ReturnThisValue(){
window.opener.ReturnValue(document.getElementById(’SelectedItem’).value);
}
7,其它
a, 在FF中，自定义的属性必须使用getAttribute()
b, FF中没有 parentElement parement.children 而用parentNode parentNode.childNodes,可以使用 node.getElementsByTagName()
c, FF不支持onpropertychange事件
d, FF中 createElement不支持HTML代码,可以考虑用:document.write(esHTML);
e, IE 中innerText ,在FF中可以用textContent
f, FF下用class代替IE下的className
g, 如果FF调用obj.focus(); 报错,请尝试改为:window.setTimeout( function(){ obj.focus(); }, 0);
h, firefox不支持 FILTER
i, IE: blur发生在focus后,FF: blur发生在focus前调用
j. IE:event.keyCode=====FF：event.which
function catcathevent(evt)
{
evt = evt ? evt : (window.event ? window.event : null);
if (document.all){
var keyvalue=evt.keyCode;
}
else{
var keyvalue=evt.which;
}
k. 设置容器位置 left、top及长宽,必须加上’px’,如 $(’obj’).style.left = ‘50px’;
l.在FF地址栏中输入about:config，会出现火狐的参数配置设置
IE中 document.formName.item(”itemName”)
FF中 document.formName.elements["elementName"]
建议使用document.getElementById(itemName)
2, 下标运算
IE中 document.forms(”formName”)
FF中 document.forms["formName"]
IE中 document.getElementsByName(”inputName”)(1)
FF中 document.getElementsByName(”inputName”)[1]
建议使用[]作为下标运算
3,window.event
IE中 可以使用window.event
FF中 event 只能在事件发生的现场使用,可以改写成 事件=函数(event);
function somemethod(evt) {
evt = evt ? evt : (window.event ? window.event : null);
alert(evt);
}
例如: <input onclick=somemethod(event)>
4,event.x 与 event.y 问题
IE中,event 对象有 x, y 属性
FF中,可用event.clientX ,event.clientY替代(IE也有该属性)
也可用:mX = event.x ? event.x : event.pageX;
5,操作frame
IE中 可以用window.FrameName取得该frame，FF中不行
FF中 可以用window.top.document.getElementById(”frameId”)来访问frame
注:IE 和FF都可以通过window.top.document.getElementById(”Frame”).src = ’somefile.htm’来切换frame的 内容,也都可以通过window.top.frameName.location = ’somefile.htm’来切换frame的内容
6,调用showModalDialog
IE中可以用showModalDialog一个子窗口,并获得返回值.
FF中没有showModalDialog,但可以用window.open来实现.
例如:
在Main.cfm文件中有如下代码:
function ShowItemList(Obj){
if (document.all){//IE
var ReturnValue=window.showModalDialog(”ItemList.cfm?Id=341″,”self”,”dialogwidth:500px;status:false”);
if (typeOf(ReturnValue)!=’undefined’){
Obj.value=ReturnValue;
}
}
else{
var subwin=window.open(Item.cfm?id=341,’newWin’,’modal=yes,width=500px’);
}
}
function ReturnValue(ReturnValue){
Obj=document.getElementById(’elementname’);
Obj.value=ReturnValue;
}
如果需要得到返回值.需要用到window.open的参数modal=yes,而且必须在子窗口中向母窗口传值(window.opener).
例如在subwin.cfm中加入以下代码:
function ReturnThisValue(){
window.opener.ReturnValue(document.getElementById(’SelectedItem’).value);
}
7,其它
a, 在FF中，自定义的属性必须使用getAttribute()
b, FF中没有 parentElement parement.children 而用parentNode parentNode.childNodes,可以使用 node.getElementsByTagName()
c, FF不支持onpropertychange事件
d, FF中 createElement不支持HTML代码,可以考虑用:document.write(esHTML);
e, IE 中innerText ,在FF中可以用textContent
f, FF下用class代替IE下的className
g, 如果FF调用obj.focus(); 报错,请尝试改为:window.setTimeout( function(){ obj.focus(); }, 0);
h, firefox不支持 FILTER
i, IE: blur发生在focus后,FF: blur发生在focus前调用
j. IE:event.keyCode=====FF：event.which
function catcathevent(evt)
{
evt = evt ? evt : (window.event ? window.event : null);
if (document.all){
var keyvalue=evt.keyCode;
}
else{
var keyvalue=evt.which;
}
k. 设置容器位置 left、top及长宽,必须加上’px’,如 $(’obj’).style.left = ‘50px’;
l.在FF地址栏中输入about:config，会出现火狐的参数配置设置
