JavaScript＋PHP 应用一：网页制作中双下拉菜单的动态实现

---摘自互联网

在网页制作中，常常遇到这种情况，通过主下拉菜单的选择，动态的生成子下拉菜单。例如：在主菜单中有“焦点新闻”、“生活时尚”、“心情故事”三个选项，通过“焦点新闻”的选择，子菜单自动生成如“国内”、“国际”、“体育”、“文娱”，依此类推。

利用javascript，我们可以轻松实现上述效果。但问题是，如果菜单中的选项是从数据库（或其他文件）中动态提取，实现起来就并不是轻而易举的了。笔者根据自己的实际经验，向大家介绍一种利用javascript ＋ php的实现方法，文中的数据库采用mysql。在本例中，笔者还将介绍在每一次表单提交之后，如何返回上一次菜单选项的选择状态。

文章中所介绍的php的作用，一是用来从数据库中提取菜单选项，另一作用，就是用来生成javascript代码。读者可以采用自己熟悉的解释型语言，如asp。

为了简化代码，笔者假设主菜单已经通过html构造，由于子菜单需要动态设计，所以只绘制了基本框架，html代码如下：

<select name="mmenu" onchange="java script:setmenu()"> //主菜单设计

<option value="a">焦点新闻</option>

<option value="b">生活时尚</option>

<option value="c">心情故事</option>

//value必须与下文的menu数组相一致

</select>

<select name="smenu"> //子菜单设计

</select>

我们需要考虑的是，菜单的onchange()事件需要完成哪些步骤。其大致过程是，根据主菜单的选项，构造子菜单项目。而子菜单的项目文字最好事先设定。根据这个思路，笔者采用了javascript中的联合数组记录子菜单选项，并由php在加载时自动生成。由此，笔者设计了如下的javascript函数setmenu()：

function setmenu(){

menu=array("a","b","c"); //构造menu联合数组

<?php //开始php程序

$db = new my_db();

$db->database = "***"; //构造新的mysql连接，这里使用了phplib

$mmenu = array("a","b","c"); //这里笔者作了简化

for ($i=0;$i<count($mmenu);$i++){

[1] [2] [3] 下一页

在google里搜索更多JavaScript＋PHP 应用一：网页制作中双下拉菜单的动态实现(转贴)

	Web www.51ec.org

上一篇信息学院： 用 PHP 动态创建 Flash 动画…

下一篇信息学院： php.ini中文版