IE与FireFox不兼容问题

以下代码在IE时搜索功能正常，在FireFox下输入关键字不能及时搜索出东西，具体请运行以下代码<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
    <meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
   <meta name="Description" content="">
    <title>省、市、区三级联动</title>
<style>

</style>
  </head>
  <body>
  选择的地区：
<input type="text" id="diqu" name="area" value="" onFocus="popupTips('frame')" readonly/><br>
<div id="frame" class="win_in">
<div class="win_top">
       <span class="span1">选择地区</span>
       <span class="span2"><a href="javascript:void(0)" onClick="closeDiv('frame');" class="link_black">关闭</a></span>
        </div>
        <div class="aa">
            <div class="search">
                搜索：<input type="text" id="ss" name="find" value=""/>
            </div>
            <br>
            <TABLE id="tab">
                <TR>
                    <TD width="74">省/直辖市:</TD>
                    <TD style="cursor:hand; background-color:#FFcccc;" onClick="showcity('',this)">浙江省</TD>
                </TR>
                <TR>
                    <TD>城市:</TD>
                </TR>
                <TR>
                    <TD>地区:</TD>
                </TR>
            </TABLE>
        </div>
</div>
    <input type="checkbox" />A
    <input type="checkbox" />B
    <input type="checkbox" />C
    <input type="checkbox" />D<SCRIPT LANGUAGE="JavaScript">
<!--
var prov = 0;
var city = 1;
var dist = 2;
    var arr = new Array();
    arr[0] = ["浙江省","杭州市","市辖区"];
    arr[1] = ["浙江省","杭州市","上城区"];
    arr[2] = ["浙江省","杭州市","下城区"];
    arr[3] = ["浙江省","杭州市","江干区"];
    arr[4] = ["浙江省","杭州市","拱墅区"];
    arr[5] = ["浙江省","杭州市","西湖区"];
    arr[6] = ["浙江省","杭州市","滨江区"];
    arr[7] = ["浙江省","杭州市","萧山区"];
    arr[8] = ["浙江省","杭州市","余杭区"];
    arr[9] = ["浙江省","杭州市","桐庐县"];
    arr[10] = ["浙江省","杭州市","淳安县"];
    arr[11] = ["浙江省","杭州市","建德市"];
    arr[12] = ["浙江省","杭州市","富阳市"];
    arr[13] = ["浙江省","杭州市","临安市"];
    arr[14] = ["浙江省","宁波市","市辖区"];
    arr[15] = ["浙江省","宁波市","海曙区"];
    arr[16] = ["浙江省","宁波市","江东区"];
    arr[17] = ["浙江省","宁波市","江北区"];
    arr[18] = ["浙江省","宁波市","北仑区"];
    arr[19] = ["浙江省","宁波市","镇海区"];
    arr[20] = ["浙江省","宁波市","鄞州区"];var selectedIndex=-1;
var intTmp; //循环参数var tab = document.getElementById("tab");
function showcity(first,tdprov){
    //清除前次显示结果
    for (var i=tab.rows[1].cells.length-1; i>0; i--)
    {
        tab.rows[1].removeChild(tab.rows[1].cells[i]);
    }
    for (var i=tab.rows[2].cells.length-1; i>0; i--)
    {
        tab.rows[2].removeChild(tab.rows[2].cells[i]);
    }

if(first==""){
var sheng = tdprov.innerHTML;
}else{
var sheng = first;
}

    var last;
    for (var i=0; i<arr.length; i++)
    {
        if (arr[i][prov] == sheng && last != arr[i][city])
        {
            var newcell = tab.rows[1].insertCell(-1);
            newcell.style.cursor = "hand";
            newcell.innerHTML = arr[i][city];
            newcell.onclick = function(){
showdist("",this);
//清除表格栏中背景颜色
for(var j=1;j<tab.rows[1].cells.length;j++){
tab.rows[1].cells[j].style.backgroundColor="";
}
this.style.backgroundColor='#FFcccc';
};
last = arr[i][city];
//默认显示杭州相关地区
if(i==0){
showdist(last,"");
newcell.style.backgroundColor='#FFcccc';
}
        }

    }

//搜索栏的清空操作
document.getElementById("ss").value="";
selectedIndex = -1;
}function showdist(first,tdcity){
    //清除前次显示结果
    for (var i=tab.rows[2].cells.length-1; i>0; i--)
    {
        tab.rows[2].removeChild(tab.rows[2].cells[i]);
    }

if(first==""){
var cheng = tdcity.innerHTML;
}else{
var cheng = first;
}

    for (var i=0; i<arr.length; i++)
    {
        if (arr[i][city] == cheng )
        {
            var newcell = tab.rows[2].insertCell(-1);
            newcell.innerHTML = arr[i][dist];
newcell.style.cursor = "hand";
/*
//浏览器兼容
var theEvent = window.event || arguments.callee.caller.arguments[0];
obj = theEvent.srcElement;
*/
newcell.onclick = function(){
alertdist(this.innerHTML);
closeDiv(document.getElementById("frame"));
}
        }

    }

}

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

function alertdist(dist){
document.getElementById("diqu").value = dist;
}function $id(){
var elements = new Array();
for (var i = 0; i < arguments.length; i++){
var element = arguments[i];
if (typeof element == 'string')
element = document.getElementById(element);
if (arguments.length == 1)
return element;
elements.push(element);
}
return elements;
}function popupTips(obj){
//默认显示杭州市
this.showcity("浙江省","");
var popupDiv = $id(obj);
popupDiv.className = "popupdiv";
popupDiv.style.marginLeft = "-" + popupDiv.clientWidth/2 + "px";
popupBg = document.createElement("div");
popupBg.setAttribute("id","popupbg");
pHeight = popupDiv.clientHeight;
bHeight = document.body.clientHeight;
if(pHeight>bHeight){
popupBg.style.height = pHeight+300+"px";
popupDiv.style.marginTop = "-250px";
}else{
popupBg.style.height = bHeight+"px";
popupDiv.style.marginTop  = "-" + popupDiv.clientHeight/2 + "px";
}
document.body.appendChild(popupBg);
hiddenSelect();
document.getElementById("diqu").value = "";
}function closeDiv(obj){
popupBg.className = "hidden";
$id(obj).className = "hidden";
showSelect();
}function hiddenSelect(){
if($id("leftcnt")){
var items = $id("leftcnt").getElementsByTagName("select");
for(var i=0;i<items.length;i++){
items[i].style.visibility="hidden";
}
}
}function showSelect(){
if($id("leftcnt")){
var items = $id("leftcnt").getElementsByTagName("select");
for(var i=0;i<items.length;i++){
items[i].style.visibility="visible";
}
}
}var intIndex=0;arrList = new Array();  for(var i=0;i<arr.length;i++){
arrList[intIndex++] = arr[i][dist];
} function smanPromptList(arrList,objInputId){
this.style = "background:#FFF; border:1px solid #CCCCCC;font-size:14px;cursor: default; z-index:1000;"
if (arrList.constructor!=Array){
alert('smanPromptList初始化失败:第一个参数非数组!');
return ;
}
window.onload =function() {
  arrList.sort(function(a,b){
  if(a.length>b.length)return 1;
  else if(a.length==b.length)return a.localeCompare(b);
  else return -1;
  })

var objouter = document.getElementById("__smanDisp") //显示的DIV对象
var objInput = document.getElementById(objInputId); //文本框对象

if (objInput==null){
alert('smanPromptList初始化失败:没有找到"'+objInputId+'"文本框');
return ;
} //文本框失去焦点
objInput.onblur=function(){
objouter.style.display='none';
}
//文本框按键抬起
objInput.onkeyup=checkKeyCode;
//文本框得到焦点
objInput.onfocus=checkAndShow;

objInput.onKeyPress = checkKeyCode;

function checkKeyCode(){
var ie = (document.all)? true:false
if (ie){
var keyCode=event.keyCode
if (keyCode==40||keyCode==38){ //下上
  var isUp=false
  if(keyCode==40) isUp=true ;
  chageSelection(isUp);
}else if (keyCode==13){//回车
  outSelection(selectedIndex);
}else{
  checkAndShow()
}
}else{
var enableEnter = true;
function myEvent(evt){
evt = evt||window.event;
var keyCode=evt.which||evt.keyCode;
if (keyCode==40||keyCode==38){ //下上
  var isUp=false
  if(keyCode==40) isUp=true ;
  chageSelection(isUp)
}else if (keyCode==13){//回车
  outSelection(selectedIndex);
}else{
  var currentTime = new Date();
  while(new Date().getTime()<currentTime.getTime+1000){
  }
  checkAndShow()
}
}
document.onkeydown = myEvent;

}

divPosition()
}

function checkAndShow(){
var strInput = objInput.value
if (strInput!=""){
divPosition();
   selectedIndex=-1;
   objouter.innerHTML ="";
   for (intTmp=0;intTmp<arrList.length;intTmp++){
for(i=0;i<arrList[intTmp].length;i++){
if (arrList[intTmp].substr(i, strInput.length).toUpperCase()==strInput.toUpperCase()){
  addOption(arrList[intTmp],strInput);
}
}

}
objouter.style.display='';
}else{
   objouter.style.display='none';
}

function addOption(value,keyw){
var v=value.replace(keyw,"<b><font color=red>"+keyw+"</font></b>");
objouter.innerHTML +="<div onmouseover=\"this.className='sman_selectedStyle'\" onmouseout=\"this.className=''\" onmousedown=\"document.getElementById('"+objInputId+"').value='" + value + "'\">" + v + "</div>"
}
}

function chageSelection(isUp){
if (objouter.style.display=='none'){
objouter.style.display='';
}else{
if (isUp)
  selectedIndex++ ;
else
  selectedIndex-- ;
}

var maxIndex = objouter.children.length-1;
if (selectedIndex<0){selectedIndex=0}
if (selectedIndex>maxIndex){selectedIndex=maxIndex}
for (intTmp=0;intTmp<=maxIndex;intTmp++){
if (intTmp==selectedIndex){
  objouter.children[intTmp].className="sman_selectedStyle";
}else{
  objouter.children[intTmp].className="";
}
}

}

function outSelection(Index){
if(Index>-1&&(document.getElementById("ss").value!="")){
//浏览器兼容
var text = (objouter.children[Index].innerText!=undefined)?(objouter.children[Index].innerText):(objouter.children[Index].textContent)
objInput.value = text;
objouter.style.display='none';
document.getElementById("diqu").value = text;
this.closeDiv(document.getElementById("frame"));
objInput.blur();
}else{
alert("无相关信息！");
}
}

function divPosition(){
objouter.style.top =getAbsoluteHeight(objInput)+getAbsoluteTop(objInput);
objouter.style.left =getAbsoluteLeft(objInput);
objouter.style.width=getAbsoluteWidth(objInput);
}
}
document.write("<div id='__smanDisp' style='position:absolute;display:none;" + this.style + "' onblur onkeyup onfocus> </div>");
document.write("<style>.sman_selectedStyle{background-Color:#BFE6F9;color:#FFFFFF}</style>"); function getAbsoluteHeight(ob){
return ob.offsetHeight;
} function getAbsoluteWidth(ob){
return ob.offsetWidth;
} function getAbsoluteLeft(ob){
var s_el=0;
el=ob;
while(el){
s_el=s_el+el.offsetLeft;
el=el.offsetParent;
}
return s_el;
} function getAbsoluteTop(ob){
var s_el=0;el=ob;
while(el){
s_el=s_el+el.offsetTop;
el=el.offsetParent;
}
return s_el;
}
}
smanPromptList(arrList,"ss");
-->
</SCRIPT>  </body>
</html>
jquery可以很好地解决兼容问题，而且可以简化代码，强烈推荐~