我使用AJAX来使php文件从MySQL数据库获取数据，并根据用户的首选下拉列表将其填充到下拉列表中。一切正常，第二个下拉列表已正确填充。
我遇到的问题是，从第二个下拉列表中选择一个选项时，整个第二个下拉列表在选择时就消失了，我无法弄清原因。
工作示例可以在这里找到。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script>
function showUser(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","getuser.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select name="width" onchange="showUser(this.value)">
<option value="">Select a Width:</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</form>
<br>
<div id="txtHint">
<form>
<select name="length" onchange="showUser(this.value)">
<option value="">Step 2</option>
</select>
</form>
</div>
</body>
</html>
<?php
$q = intval($_GET['q']);
$con = mysql_connect('cust-mysql-123-17','products','abc123','products');
if (!$con)
{
die('Could not connect: ' . mysql_error($con));
}
mysql_select_db("products",$con);
$sql="SELECT * FROM deepblack WHERE width = '".$q."'";
$result = mysql_query($sql,$con);
echo "<form>
<select name=\"length\" onchange=\"showUser(this.value)\">
<option value=\"\">Select a Length</option>";
while($row = mysql_fetch_array($result))
{
echo "<option value=\"\">". $row['length'] ."</option>";
}
echo"
</select>
</form>";
mysql_close($con);
?>
谁能帮我解释为什么它消失了？
我需要的最终结果是用户选择一个宽度，然后使用可用的长度填充第二个下拉列表。用户从第二个下拉菜单中选择要购买的长度。因此，第二个下拉菜单中我计划将其发送给PayPal或其他商家的表格。如果有人知道更好的方法，也请说。
您的第二个下拉列表具有 Value=""
<select onchange="showUser(this.value)" name="length">
<option value="">Select a Length</option>
<option value="">5</option>
<option value="">10</option>
</select>
选择它时，它将调用JS并执行以下条件：
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
....
用...覆盖DIV ID=txtHINT
如果要修复它：确保在此行中
echo "<option value=\"\">". $row['length'] ."</option>";
该值不为空，或更改JS。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句