Ajax和PHP驱动的下拉列表在Internet Explorer中无法正常工作

Question

嗨，我在IE中的ajax脚本有问题，在所有其他浏览器中似乎都可以正常工作。 我正在尝试重新编写一个下拉列表，以显示不同的价格范围，具体取决于用户是要租房还是要买房，这是我如何解决的

标头部分的功能：

<script type="text/javascript">
function showPrice(str)
{
    if (str=="")
    {
        document.getElementById("txtHint").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("txtHint").innerHTML=xmlhttp.responseText;
        }
    }

    xmlhttp.open("GET","getprice.php?q="+str,true);
    xmlhttp.send();
}
</script>

这是构成表的HTML代码：

<table>
<form method="GET" action="search_results.php">
<tr>
    <td>
        <select name="type" style="width:120px">
            <option selected="selected" value="residential">residential</option>
            <option value="commercial">commercial</option>
            <option value="business">business</option>
            <option value="student">student &amp; sharers</option>
        </select>
    </td>
    <td>
        <select name="offered" style="width:120px" onchange="showPrice(this.value)">
            <option selected="selected" value="for_sale">for sale</option>
            <option value="to_let">to let</option>
        </select>
    </td>
    <td>
        <select name="area"  style="width:120px">
            <option selected="selected" value="any">any area</option>
            <?php 
                $sql="select * from areas;";
                $result=mysql_query($sql);

                while($data=mysql_fetch_array($result))
                {
                    $area=$data['area'];
                    echo "<option value='$area'>$area</option>";
                }
            ?>
        </select>
    </td>
</tr>
<tr id="txtHint">
    <td>
        <select name='minprice' style="width:120px">
            <option selected='selected' value=''>min price</option>
            <option value='50000'>&pound;50,000</option>
            <option value='75000'>&pound;75,000</option>
            <option value='100000'>&pound;100,000</option>
            <option value='125000'>&pound;125,000</option>
            <option value='150000'>&pound;150,000</option>
            <option value='175000'>&pound;175,000</option>
            <option value='200000'>&pound;200,000</option>
            <option value='250000'>&pound;250,000</option>
            <option value='300000'>&pound;300,000</option>
            <option value='400000'>&pound;400,000</option>
            <option value='500000'>&pound;500,000</option>
            <option value='750000'>&pound;750,000</option>
            <option value='1000000'>&pound;1,000,000</option>
            <option value='1500000'>&pound;1,500,000</option>
        </select>
    </td>
    <td>
        <select name='maxprice' style="width:120px">
            <option selected='selected' value=''>max price</option>
            <option value='50000'>&pound;50,000</option>
            <option value='75000'>&pound;75,000</option>
            <option value='100000'>&pound;100,000</option>
            <option value='125000'>&pound;125,000</option>
            <option value='150000'>&pound;150,000</option>
            <option value='175000'>&pound;175,000</option>
            <option value='200000'>&pound;200,000</option>
            <option value='250000'>&pound;250,000</option>
            <option value='300000'>&pound;300,000</option>
            <option value='400000'>&pound;400,000</option>
            <option value='500000'>&pound;500,000</option>
            <option value='750000'>&pound;750,000</option>
            <option value='1000000'>&pound;1,000,000</option>
            <option value='1500000'>&pound;1,500,000</option>
        </select>
    </td>
    <td>
        <select name="bedrooms" style="width:120px">
            <option selected="selected" value="">Bedrooms</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5 or more</option>
        </select>
    </td>
</tr>
</form>
</table>

这是php文件，该文件决定是呼应情人价格范围还是价格上限：

<?php
$q=$_GET["q"];

if($q=="to_let")
{
<td>
    <select name='minprice' style='width:120px'>
        <option selected='selected' value=''>min price</option>
        <option value='250'>&pound;250</option>
        <option value='500'>&pound;500</option>
        <option value='750'>&pound;750</option>
        <option value='1000'>&pound;1000</option>
        <option value='1250'>&pound;1250</option>
        <option value='1500'>&pound;1500</option>
        <option value='2000'>&pound;2000</option>
    </select>
</td>
<td>
    <select name='maxprice' style='width:120px'>
        <option selected='selected' value=''>max price</option>
        <option value='250'>&pound;250</option>
        <option value='500'>&pound;500</option>
        <option value='750'>&pound;750</option>
        <option value='1000'>&pound;1000</option>
        <option value='1250'>&pound;1250</option>
        <option value='1500'>&pound;1500</option>
        <option value='2000'>&pound;2000</option>
    </select>
</td>
<td>
    <select name='bedrooms' style='width:120px'>
        <option selected='selected' value=''>Bedrooms</option>
        <option value='1'>1</option>
        <option value='2'>2</option>
        <option value='3'>3</option>
        <option value='4'>4</option>
        <option value='5'>5 or more</option>
    </select>
</td>
PRICE;
}
else
{
    $my_string = <<<PRICE
    <td>
        <select name='minprice' style='width:120px'>
            <option selected='selected' value=''>minimum price</option>
            <option value='50000'>&pound;50,000</option>
            <option value='75000'>&pound;75,000</option>
            <option value='100000'>&pound;100,000</option>
            <option value='125000'>&pound;125,000</option>
            <option value='150000'>&pound;150,000</option>
            <option value='175000'>&pound;175,000</option>
            <option value='200000'>&pound;200,000</option>
            <option value='250000'>&pound;250,000</option>
            <option value='300000'>&pound;300,000</option>
            <option value='400000'>&pound;400,000</option>
            <option value='500000'>&pound;500,000</option>
            <option value='750000'>&pound;750,000</option>
            <option value='1000000'>&pound;1,000,000</option>
            <option value='1500000'>&pound;1,500,000</option>
    </select>
</td>
<td>
    <select name='maxprice' style='width:120px'>
        <option selected='selected' value=''>maximum price</option>
        <option value='50000'>&pound;50,000</option>
        <option value='75000'>&pound;75,000</option>
        <option value='100000'>&pound;100,000</option>
        <option value='125000'>&pound;125,000</option>
        <option value='150000'>&pound;150,000</option>
        <option value='175000'>&pound;175,000</option>
        <option value='200000'>&pound;200,000</option>
        <option value='250000'>&pound;250,000</option>
        <option value='300000'>&pound;300,000</option>
        <option value='400000'>&pound;400,000</option>
        <option value='500000'>&pound;500,000</option>
        <option value='750000'>&pound;750,000</option>
        <option value='1000000'>&pound;1,000,000</option>
        <option value='1500000'>&pound;1,500,000</option>
    </select>
</td>
<td>
    <select name='bedrooms' style='width:120px'>
        <option selected='selected' value=''>Bedrooms</option>
        <option value='1'>1</option>
        <option value='2'>2</option>
        <option value='3'>3</option>
        <option value='4'>4</option>
        <option value='5'>5 or more</option>
    </select>
</td>

PRICE;
}

echo $my_string;
?>

这似乎在FF，Safari和Chrome中非常有效，只是在IE中却没有，我已经看到了类似的问题，但是没有什么可以解决此特定问题。

任何帮助或建议对此将不胜感激。

Answer 1

提意见评论：

我建议您加载两个集合并通过隐藏或显示在它们之间切换：

window.onload=function() {
  showPrice('for_sale'); // or do this in CSS
}
function showPrice(letOrSale) { 
  var forSale = letOrSale==="for_sale";
  document.getElementById('forLetId').style.display=forSale?"none":"";
  document.getElementById('forSaleId').style.display=forSale?"":"none"; 
}