php - 根据 AJAX 响应更改下拉值

Question

我不太精通 AJAX，但从各方面来看，我认为这应该可行。它应该做的是用户从下拉列表中选择一个名称，另一个下拉列表(使用 PHP 从 mysql 数据库填充)自动选择关联的对象。假设您有:

姓名:苏西/迈克尔/凯伦

最喜欢的水果:苹果/橙子/芒果/ Guava

通过选择 Susie，它会自动选择“橙色”，因为这是数据库中她最喜欢的水果。

我有这段 Ajax 代码，用于将下拉列表更改为关联的“水果”。

 <script type="text/javascript">
function getAff(str)
{
if (str=="NULL" || str=="")
  {
  document.getElementById("fruit").value="";
  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)
    {
    alert(xmlhttp.responseText);

 var indexVal = document.getElementById("fruit").length;
  for(x=0; x<indexVal;x++) {
  if (document.getElementById("fruit").options[x].value == xmlhttp.responseText) {
   document.getElementById("fruit").selectedIndex = x;
   //alert(xmlhttp.responseText);
   }
  }
    }
  }
xmlhttp.open("GET","getaff.php?q="+str,true);
xmlhttp.send();
}
</script>

我已经通过警报确保它正在提取正确的值，尽管我已经在这里对此进行了评论。

唯一的问题是下拉框没有改变。不知道是不是因为是通过php生成的？但不应该如此。每个下拉选项的值是从数据库中提取的水果的名称。我还提醒自己索引值数量，看看它是否正在读取下拉列表，并且我得到了正确的数字。但下拉菜单没有改变。有什么想法吗？谢谢!

Answer 1

I'm not very proficient with AJAX but by all accounts I think this should be working

如果您不熟悉 javascript，我认为您不应该编写简单的 javascript(很难)。使用像 jquery 这样的框架这非常受欢迎，并且使这些平凡的任务变得非常简单。

What it's supposed to do is the user selects a name from a dropdown, and another dropdown (populated from a mysql database with PHP) automatically selects the associated object.

您应该查看以下部分:

• How Jquery works :帮助您入门。
• s elect() :将事件处理程序绑定(bind)到“select”JavaScript 事件，或在元素上触发该事件。

• .load : : 从服务器加载数据并将返回的HTML放入匹配的元素中。

• Jquery.get/jQuery.getJSON() :使用 HTTP GET 请求从服务器加载数据/使用 GET HTTP 请求从服务器加载 JSON 编码的数据。

• Jquery.post :使用 HTTP POST 请求从服务器加载数据。

当您阅读/浏览这些部分时，您应该能够毫不费力地写出这些内容(还要感谢令人难以置信的 John Resig)。