Question

IE不会在我使用Ajax更新的选择框中加载值，但其他浏览器会这样做。

HTML：

<form id="auto_form" action="index.php?page=confirm_user" method="post">
    Year: 
        <select id="auto_year" name="auto_year">
            <option>Select option..</option>
%year%
        </select>
                    <br />
    <span id="auto_brand_title" style="display:none;">Brand:</span>
        <select id="auto_brand" style="display:none;" name="auto_brand" onchange="">
        </select>
                    <br />
    <span id="auto_model_title" style="display:none;">Model: </span>
        <select id="auto_model" style="display:none;" name="auto_model">
        </select>
                    <br />
            <!--Start extra choices-->
            <span id="auto_bodywork_title" style="display:none;">Bodywork: </span>
                <select id="auto_bodywork" style="display:none;" name="auto_bodywork">
                </select>
                            <br />
            <span id="auto_doors_title" style="display:none;">Doors: </span>
                <select id="auto_doors" style="display:none;" name="auto_doors">
                </select>
                            <br />
            <span id="auto_fuel_title" style="display:none;">Fuel: </span>
                <select id="auto_fuel" style="display:none;" name="auto_fuel">
                </select>
                            <br />
            <span id="auto_gearbox_title" style="display:none;">Gear Box: </span>
                <select id="auto_gearbox" style="display:none;" name="auto_gearbox">
                </select>
            <!--End extra choices-->
                    <br />
    <span id="auto_type_title" style="display:none;">Type: </span>
        <select id="auto_type" style="display:none;" name="auto_type">
        </select>
                    <br />
    <span id="auto_uitvoering_title" style="display:none;">Uitvoering: </span>
        <select id="auto_uitvoering" style="display:none;" name="auto_uitvoering">
        </select>

jQuery的：

    $("#auto_year").change(function(){
       updateField(this.value, 'auto_brand', 1, 2, this.parentNode.id), resetBelow(0,'auto'), show('auto_brand');
    });

    $("#auto_brand").change(function(){
       updateField(this.value, 'auto_model', 2, 3, this.parentNode.id), resetBelow(1,'auto'), show('auto_model');
    });

    $("#auto_model").change(function(){
       updateField(this.value, 'auto_bodywork', 3, 4, this.parentNode.id), resetBelow(2,'auto'), show('auto_bodywork');
    });

    $("#auto_bodywork").change(function(){
       updateField(this.value, 'auto_doors', 4, 5, this.parentNode.id), resetBelow(3,'auto'), show('auto_doors');
    });

    $("#auto_doors").change(function(){
       updateField(this.value, 'auto_fuel', 5, 6, this.parentNode.id), resetBelow(4,'auto'), show('auto_fuel');
    });

    $("#auto_fuel").change(function(){
       updateField(this.value, 'auto_gearbox', 6, 7, this.parentNode.id), resetBelow(5,'auto'), show('auto_gearbox');
    });

    $("#auto_gearbox").change(function(){
       updateField(this.value, 'auto_type', 7, 8, this.parentNode.id), resetBelow(6,'auto'), show('auto_type');
    });

    $("#auto_type").change(function(){
       updateField(this.value, 'auto_uitvoering', 8, 9, this.parentNode.id), resetBelow(7,'auto'), show('auto_uitvoering');
    });

    $("#auto_uitvoering").change(function(){
       updateField(this.value, '', 9, 10, this.parentNode.id), resetBelow(8,'auto');
    });

Ajax功能：

function updateField(str, id, prevvalue, value, vehicletype)
{
if (str=="")
  {
  document.getElementById(id).innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(id).innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","inc/form_rest.php?q="+str+"&prevvalue="+prevvalue+"&value="+value+"&vehicletype="+vehicletype,true);
xmlhttp.send();
}

Answer 1

在.change（）调用中，尝试使用$（this）.val（）而不是this.value。在ie中，事件在窗口对象而不是实际元素本身上被调用，这会影响“this”的范围。 $（this）应该为你规范化，并且由于它现在是一个jQuery对象，你将不得不使用jQuery函数而不是本机js属性，因此需要.val（）。

另外，我强烈建议您使用$ .ajax（）而不是尝试自己处理跨浏览器调用。使用jQuery的一半要点是击败跨浏览器的噩梦。如果您要在页面上加载它，请继续编写所有脚本jQuery。

Internet Explorer不会在选择框中加载值

1 个答案: