Question

我正在尝试使用AJAX和PHP根据之前的选择从另一个下拉菜单更新下拉菜单的选项。

我在我的文档的头部有这个脚本：

<script>
function show_districts(str)
{
if (str.length==0)
  {
  document.getElementById("districts_dropdown").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("districts_dropdown").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","get_districts.php?q="+str,true);
xmlhttp.send();
}
</script>

...当触发onchange()时，会传递此下拉列表的值：

<label for="banner" class="medium">Banner</label>
<select name="banner" id="banner" class="textbox short_field" onchange="show_districts(this.value)">
<option value=""></option>
<?php

    $result = mysql_query("SELECT name FROM banners", $connection);
    if (!result) {
        die("Database query failed: " . mysql_error());
    }

    while ($row = mysql_fetch_array($result)) {
        echo '<option value="' . $row["name"] . '"';
        if($row["name"] == $banner) { echo 'selected';} ;
        echo '>' . $row["name"] . '</option>';
    }
?>
</select>

...到这个php文件：

<?php require_once("includes/connection.php"); ?>
<?php require_once("includes/functions.php"); ?>
<?php
$q = $_REQUEST['q'];

if($q = 'TBOOTH') {$id = 2;}

$result = mysql_query("SELECT dist.name FROM districts AS dist JOIN int_bd AS ibd ON dist.id = ibd.districts_id WHERE banners_id = '".$id."' GROUP BY dist.id ORDER BY dist.id ASC", $connection);
    if (!result) {
        die("Database query failed: " . mysql_error());
    }

    while ($row = mysql_fetch_array($result)) {
        echo '<option value="' . $row["name"] . '"';
        if($row["name"] == $district) { echo ' selected';} ;
        echo '>' . $row["name"] . '</option>';
    }

mysqli_close($connection);
?>

...应该使用<span id="districts_dropdown">

将php文件中的值返回到此下拉菜单

<label for="district" class="medium">District</label>
<select name="district" class="textbox short_field">
<option value=""></option>
<span id="districts_dropdown"></span>
</select>

如果<span id="districts_dropdown">位于<select>标记之外，但不在<select>标记内，则效果很好。任何关于为什么会被非常感激的见解。

感谢您帮助Popnoodles！我通过让PHP代码生成整个<?php $q = $_REQUEST['q']; $id = ""; if ($q = 'TBOOTH') { $id = "2"; } else { if ($q = 'WIRELESS ETC') { $id = "3"; } } echo '<select name="district" class="textbox short_field"> <option value=""></option>'; $query = "SELECT dist.name FROM districts AS dist JOIN int_bd AS ibd ON dist.id = ibd.districts_id WHERE banners_id = '".$id."' GROUP BY dist.id ORDER BY dist.id ASC"; $result = mysql_query($query, $connection); if (!result) { die("Database query failed: " . mysql_error()); } while ($row = mysql_fetch_array($result)) { echo '<option value="' . $row["name"] . '"'; if($row["name"] == $district) { echo ' selected';} ; echo '>' . $row["name"] . '</option>'; } mysql_close($connection); ?>标签来解决部分问题：

$id

但是，当onchange()被触发时，我在该代码顶部的{{1}}变量不会更新。

Answer 1

看起来您想要重新填充选择标记中的选项。首先，你不能在那里放一个跨度。请遵守the specs - <select>标记只能包含<option>和<optgroup>标记。

这就是你要改变的东西

document.getElementById("districts_dropdown").innerHTML=xmlhttp.responseText;

那么如果你的目标是

会发生什么

<select name="banner" id="banner" class="textbox short_field" onchange="show_districts(this.value)">

与

document.getElementById("banner").innerHTML=xmlhttp.responseText;

你可以选择。 http://jsfiddle.net/Da26e/1/

PHP＆amp; AJAX不返回表单元素中的值

1 个答案: