Javascript 如何使用ajax根据两个下拉列表的值从数据库检索数据？

我已经实施了这个计划。在这里，我只使用一个下拉列表检索数据。工作正常。但如果我想对两个下拉列表执行相同的操作，即必须根据两个下拉列表的值检索数据库中的值。 我的尝试如下： Ajax脚本-

<script> // AJAX Implementation
function showCourses() {
    str = document.getElementById("branch").value;
    str1 = document.getElementById("sem").value;
    if (str == "" || str1 == "") {
        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", "listCourseByAjax.php?p=" + str + "&q=" + str1, true);
    xmlhttp.send();
}
</script>

//AJAX实现
函数showCourses（）{
str=document.getElementById（“分支”）.value；
str1=document.getElementById（“sem”）.value；
如果（str==“”| | str1==“”）{
document.getElementById（“txtHint”）.innerHTML=“”；
返回；
}
if（window.XMLHttpRequest）{//IE7+、Firefox、Chrome、Opera、Safari的代码
xmlhttp=新的XMLHttpRequest（）；
}else{//IE6、IE5的代码
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
xmlhttp.onreadystatechange=函数（）{
if（xmlhttp.readyState==4&&xmlhttp.status==200）{
document.getElementById（“txtHint”）.innerHTML=xmlhttp.responseText；
}
}
open（“GET”、“listCourseByAjax.php？p=“+str+”&q=“+str1，true”）；
xmlhttp.send（）；
}

下拉列表-

<select name="branch" onchange="showCourses(this.value)">
        <option id="branch" value="0" selected>Select one</option>
            <option id="branch" value="ISE">1/option>
            <option id="branch" value="CSE">2</option>
            <option id="branch" value="ME">3</option>
</select>
<select name="sem" onchange="showCourses(this.value)">
    <option id="sem" value="0" selected>select one</option>
    <option id="sem" value="I-P">I-P</option>
    <option id="sem" value="I-C">I-C</option>
    <option id="sem" value="II-P">II-P</option>
</select>

选择一个
1/选项>
2.
3.
选择一个
I-P
I-C
II-P

php文件-

$p = $_GET['p'];
$q = $_GET['q'];
$sql="SELECT * FROM course_details WHERE sem='" . $q . "' AND branch='" . $p . "'";
$result = mysql_query($sql);

echo "<table border='1'>
<tr>
    <th>Course Code</th>
    <th>Course Name</th>
    <th>Course Instructor</th>
    <th>Credit</th>
</tr>";

$p=$\u GET['p']；
$q=$_GET['q']；
$sql=“从课程详细信息中选择*，其中sem=”$Q“'和分支='”$P"'";
$result=mysql\u查询（$sql）；
回声“
课程代码
课程名称
课程讲师
信用
";

---

请帮助我如何操作。

如何引用选定元素的选定值，或者更准确地说，如何构造选定元素存在问题。您需要将ID（branch和sem）放在SELECT而不是单个选项上，并且在调用showCourses（）onchange时可以删除this.value参数，因为您的函数未设置为接受参数

尝试将此用于您的选择

<select name="branch" id="branch" onchange="showCourses()">
  <option value="0" selected>Select one</option>
  <option value="ISE">1</option>
  <option value="CSE">2</option>
  <option value="ME">3</option>
</select>
<select name="sem" id="sem" onchange="showCourses()">
  <option value="0" selected>select one</option>
  <option value="I-P">I-P</option>
  <option value="I-C">I-C</option>
  <option value="II-P">II-P</option>
</select>

到

---

任何人都可以帮忙……1-。使用Jquery它会让你的生活更轻松，2-。使用prepare语句。如果您需要更多帮助，您需要提供更多信息和示例，您可以使用sqlfiddle或jsfiddle来测试代码。

if (str == "" || str1 == "") {
    document.getElementById("txtHint").innerHTML = "";
    return;
}

if (str == "0" || str1 == "0") {
    document.getElementById("txtHint").innerHTML = "";
    return;
}