JavaScript＋PHP应用一：网页制作中双下拉菜单的动态实现
时间：2007-02-17 来源：PHP爱好者
在网页制作中，常常遇到这种情况，通过主下拉菜单的选择，动态的生成子下拉菜单。例如：在主菜单中有“焦点新闻”、“生活时尚”、“心情故事”三个选项，通过“焦点新闻”的选择，子菜单自动生成如“国内”、“国际”、“体育”、“文娱”，依此类推。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
利用javascript，我们可以轻松实现上述效果。但问题是，如果菜单中的选项是从数据库（或其他文件）中动态提取，实现起来就并不是轻而易举的了。笔者根据自己的实际经验，向大家介绍一种利用javascript ＋
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
php的实现方法，文中的数据库采用mysql。在本例中，笔者还将介绍在每一次表单提交之后，如何返回上一次菜单选项的选择状态。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
文章中所介绍的php的作用，一是用来从数据库中提取菜单选项，另一作用，就是用来生成javascript代码。读者可以采用自己熟悉的解释型语言，如asp。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
为了简化代码，笔者假设主菜单已经通过html构造，由于子菜单需要动态设计，所以只绘制了基本框架，html代码如下：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<select name="mmenu" onchange="javascript:setmenu()"> //主菜单设计
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<option value="a">焦点新闻</option>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<option value="b">生活时尚</option>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<option value="c">心情故事</option>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
//value必须与下文的menu数组相一致
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
</select>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<select name="smenu"> //子菜单设计
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
</select>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
我们需要考虑的是，菜单的onchange()事件需要完成哪些步骤。其大致过程是，根据主菜单的选项，构造子菜单项目。而子菜单的项目文字最好事先设定。根据这个思路，笔者采用了javascript中的联合数组记录子菜单选项，并由php在加载时自动生成。由此，笔者设计了如下的javascript函数setmenu()：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
function setmenu(){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
menu=array("a","b","c"); //构造menu联合数组
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<?php //开始php程序
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$db = new my_db();
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$db->database = "***"; //构造新的mysql连接，这里使用了phplib
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$mmenu = array("a","b","c"); //这里笔者作了简化
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
for ($i=0;$i<count($mmenu);$i++){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$id = $mmenu[$i];
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$db->query("select menu from class where menuid ='".$id."'");
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
//假设菜单选项存放在class表的menu字段，menuid用来标识menu
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
while ($db->next_record()){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$smenu[] = """.$db->f("menu").""";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
if (isset($smenu) && is_array($smenu)){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$str = implode(",",$smenu);
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "menu["$id"] =array($str);ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
//完成menu联合数组的填充
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
unset($smenu); //删除smenu变量
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
?> //结束php程序
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
with (document) {
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
id=all("mmenu").value; //获得主菜单的value值
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
arr_menu=menu[id];
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
for(i=all("smenu").options.length;i>=0;i--){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
all("smenu").options.remove(i); //需要清除原有的项目
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
if (arr_menu.length==0){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
return;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
for(i=0;i<arr_menu.length;i++){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
obj=createelement("option");
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
obj.text=arr_class;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
all("smenu").options.add(obj);
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
这样每次显示文档时，php部分将解释为javascript语言，当单击主菜单时，子菜单将自动更新。同样道理，读者可以根据此思路，创造更复杂的多重菜单选项。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
最后，笔者简要介绍一下，如何实现在表单提交后，仍然保持菜单项上一次的状态。技巧其实很多，而笔者采用的是隐含变量法。在表单中添加如下代码：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<input type="hidden" name="h1">
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<input type="hidden" name="h2">
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
我们只需要在form表单的onsubmit()事件中给每个隐含变量赋值即可。即：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
document.all("h1").value=document.all("mmenu").selectedindex;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
document.all("h2").value=document.all("smenu").selectedindex;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
为了利用隐含变量，在文档的body的onload()事件中，我们利用php方法（也可用其它方法）来控制菜单的显示：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<?php
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
if (!isset($h1)){ //只需要判断$h1
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$h1 = 0;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$h2 = 0;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("mmenu").selectedindex=".$h1.";ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("mmenu").click();ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("mmenu").selectedindex=".$h1.";ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("smenu").selectedindex=".$h2;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
?>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
至此，我们已经实现双下拉菜单的动态实现方法。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
原作者：tttk
php爱好者站 http://www.phpfans.net 为phper提供一切资讯.
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
利用javascript，我们可以轻松实现上述效果。但问题是，如果菜单中的选项是从数据库（或其他文件）中动态提取，实现起来就并不是轻而易举的了。笔者根据自己的实际经验，向大家介绍一种利用javascript ＋
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
php的实现方法，文中的数据库采用mysql。在本例中，笔者还将介绍在每一次表单提交之后，如何返回上一次菜单选项的选择状态。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
文章中所介绍的php的作用，一是用来从数据库中提取菜单选项，另一作用，就是用来生成javascript代码。读者可以采用自己熟悉的解释型语言，如asp。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
为了简化代码，笔者假设主菜单已经通过html构造，由于子菜单需要动态设计，所以只绘制了基本框架，html代码如下：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<select name="mmenu" onchange="javascript:setmenu()"> //主菜单设计
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<option value="a">焦点新闻</option>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<option value="b">生活时尚</option>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<option value="c">心情故事</option>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
//value必须与下文的menu数组相一致
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
</select>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<select name="smenu"> //子菜单设计
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
</select>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
我们需要考虑的是，菜单的onchange()事件需要完成哪些步骤。其大致过程是，根据主菜单的选项，构造子菜单项目。而子菜单的项目文字最好事先设定。根据这个思路，笔者采用了javascript中的联合数组记录子菜单选项，并由php在加载时自动生成。由此，笔者设计了如下的javascript函数setmenu()：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
function setmenu(){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
menu=array("a","b","c"); //构造menu联合数组
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<?php //开始php程序
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$db = new my_db();
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$db->database = "***"; //构造新的mysql连接，这里使用了phplib
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$mmenu = array("a","b","c"); //这里笔者作了简化
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
for ($i=0;$i<count($mmenu);$i++){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$id = $mmenu[$i];
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$db->query("select menu from class where menuid ='".$id."'");
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
//假设菜单选项存放在class表的menu字段，menuid用来标识menu
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
while ($db->next_record()){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$smenu[] = """.$db->f("menu").""";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
if (isset($smenu) && is_array($smenu)){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$str = implode(",",$smenu);
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "menu["$id"] =array($str);ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
//完成menu联合数组的填充
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
unset($smenu); //删除smenu变量
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
?> //结束php程序
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
with (document) {
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
id=all("mmenu").value; //获得主菜单的value值
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
arr_menu=menu[id];
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
for(i=all("smenu").options.length;i>=0;i--){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
all("smenu").options.remove(i); //需要清除原有的项目
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
if (arr_menu.length==0){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
return;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
for(i=0;i<arr_menu.length;i++){
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
obj=createelement("option");
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
obj.text=arr_class;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
all("smenu").options.add(obj);
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
这样每次显示文档时，php部分将解释为javascript语言，当单击主菜单时，子菜单将自动更新。同样道理，读者可以根据此思路，创造更复杂的多重菜单选项。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
最后，笔者简要介绍一下，如何实现在表单提交后，仍然保持菜单项上一次的状态。技巧其实很多，而笔者采用的是隐含变量法。在表单中添加如下代码：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<input type="hidden" name="h1">
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<input type="hidden" name="h2">
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
我们只需要在form表单的onsubmit()事件中给每个隐含变量赋值即可。即：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
document.all("h1").value=document.all("mmenu").selectedindex;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
document.all("h2").value=document.all("smenu").selectedindex;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
为了利用隐含变量，在文档的body的onload()事件中，我们利用php方法（也可用其它方法）来控制菜单的显示：
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
<?php
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
if (!isset($h1)){ //只需要判断$h1
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$h1 = 0;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
$h2 = 0;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
}
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("mmenu").selectedindex=".$h1.";ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("mmenu").click();ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("mmenu").selectedindex=".$h1.";ntt";
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
echo "document.all("smenu").selectedindex=".$h2;
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
?>
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
至此，我们已经实现双下拉菜单的动态实现方法。
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
chinaitpower.com7zbwGUbbTQGM9hkKIQQt45kLo
原作者：tttk
php爱好者站 http://www.phpfans.net 为phper提供一切资讯.
相关阅读 更多 +
