这里具有挑战性的部分是 JavaScript 和 PHP 之间的相互作用。一旦页面被渲染并发送到浏览器，PHP 代码就完成了。其他一切都必须在 JavaScript 中完成（除非您正在执行某种回发或 AJAX 模型）。

因此，您必须在 PHP 完成之前使所有值对 JavaScript 代码完全可用。有两种方法可以做到这一点：

1. 使用 PHP创建所有可能的秒<select>，但隐藏所有它们 ( style=display:none)。然后 JavaScript 将根据第一个菜单中的选择显示/隐藏适当的第二个菜单。
2. Create a JavaScript array from the PHP array that JavaScript can use to populate the second submenu dynamically when the first menu option is selected.

第一个选项可能更简单，代价是在响应中包含额外的 HTML 膨胀（如果您只有几个子菜单，这应该没什么大不了的）。因此，您将拥有以下内容：

<select name='themenu' style='width: 150px' onchange='changesubmenu(this)'>
  <option value='1'> Menu number 1 </option>
  <option value='2'> Menu number 2 </option>
  <option value='3'> Menu number 3 </option>
</select>
<select id="thepages1" style="display:none">
  <option>...</option>
  <option>...</option>
  <option>...</option>
</select>
<select id="thepages2" style="display:none">
  <option>...</option>
  <option>...</option>
  <option>...</option>
</select>
<select id="thepages3" style="display:none">
  <option>...</option>
  <option>...</option>
  <option>...</option>
</select>

你的changesubmenu()JavaScript 函数看起来像这样：

var tempid=''; // save previous id to hide it

function changesubmenu(parent) {
    // get selected menu id
    var id = parent.value;
    var submenuid = "thepages"+id;

    // show the selected menu
    var submenuel = document.getElementById(submenuid);
    if (submenuel) submenuel.style.display = "";

    // hide the previously selected menu
    var oldsubmenuid = "thepages"+tempid;
    var oldsubmenuel = document.getElementById(oldsubmenuid);
    if (oldsubmenuel) oldsubmenuel.style.display = "none";

    // update old id for reference
    tempid = id;
}​

演示：http: //jsfiddle.net/NmKvK/

根据我的经验，使用 javascript 的最佳方法是将所有可能性加载到仅显示您选择的页面上（使用 javascript）。

例如

select 1
select 2 hidden
select 3 hideen

在选择 1 您选择了选项 1

select 1
select 2 showing
select 3 hidden

在选择 1 您选择了选项 1

select 1
select 2 hidden
select 3 showing

如果您有很多内容，那么您需要使用 ajax 和第二个 php 页面动态执行此操作（或者您可以使用相同的 php 文件）。

因此，选择选项1时，它会触发一个ajax调用（带有选项1值的参数），该呼叫将content.php的内容加载到javaScript变量中，然后从那里加载它，然后在第一个之后将其加载到一个座位上选择。

希望这可以帮助！