在 ajax 中提交一个选择字段(不是整个表单）以获取其值并在同一页面上过滤 php 中的另一个选择 - Submit one select field in ajax (not entire form) to get it's value and filter another select in php on same page

Submit one select field in ajax (not entire form) to get it's value and filter another select in php on same page

这是我第一次使用Ajax（或Jquery）编程，所以我感谢任何形式的帮助。我想做的是，当我的 html 表单中有 2 个选择输入，我希望当第一个选择被更改（onchange）时，它的值使用它来过滤 php 中的第二个选择以动态生成其选项，这必须在不提交整个表单的情况下发生只有第一个选择。我尝试了以下代码，但是每当第一个选择更改时，它都会提交整个表单。AJAX 函数：

function showKadaa(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("kop").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","annonce.php?mid="+str,true);
xmlhttp.send();
}

带有 PHP 的 HTML 代码部分：

<?php if(isset($_GET['mid']))
$q=$_GET['mid'];
else $q=$_SESSION['mid'];?>
//code goes here
<tr><td>Kadaa:</td><td><div id="kop"><select name="kadaa" id="kad" ><option value="default">[Choisir     Kadaa]</option>
<?php
            if(login_db()){                     
                $req="SELECT `nom_kadaa`,`id` FROM `kadaa` WHERE `id_mohafaza`=".$q.""; 
                echo $req;
                $kadaa="";
                if($res=mysql_query($req)){
                    while($l=mysql_fetch_array($res)){
                        echo "<option value=".$l[1].">".$l[0]."</option>";
                    }                       
                }
            }               
        ?>
</select></div></td></tr>

PS：我把 id="kop"
的div 放在哪里整个页面在其中提交。我在同一页面上使用两个选择的另一件事

form action="<?php echo $_SERVER['PHP_SELF'];?>

用于获取字段值：jquery很乐意使用

$("#IdOfElement").val();

顺便说一下，jQuery为Ajax提供了更多方便的方法：

$.ajax({
  type: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});