WEB开发网
开发学院网页设计JavaScript JavaScript+PHP 应用一:网页制作中双下拉菜单的... 阅读

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

 2010-09-14 13:30:38 来源:WEB开发网   
核心提示: 我们需要考虑的是,菜单的OnChange()事件需要完成哪些步骤,JavaScript+PHP 应用一:网页制作中双下拉菜单的动态实现(2),其大致过程是,根据主菜单的选项,在表单中添加如下代码:<input type="hidden" name="h1

我们需要考虑的是,菜单的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
  
obj.text=arr_class[i];
all("smenu").options.add(obj);
}
}
}

这样每次显示文档时,PHP部分将解释为Javascript语言,当单击主菜单时,子菜单将自动更新。同样道理,读者可以根据此思路,创造更复杂的多重菜单选项。

最后,笔者简要介绍一下,如何实现在表单提交后,仍然保持菜单项上一次的状态。技巧其实很多,而笔者采用的是隐含变量法。在表单中添加如下代码:

<input type="hidden" name="h1">

<input type="hidden" name="h2">

我们只需要在Form表单的OnSubmit()事件中给每个隐含变量赋值即可。即:

document.all("h1").value=document.all("mmenu").selectedIndex;

document.all("h2").value=document.all("smenu").selectedIndex;

为了利用隐含变量,在文档的Body的onLoad()事件中,我们利用PHP方法(也可用其它方法)来控制菜单的显示:

上一页  1 2 3 4 5  下一页

Tags:JavaScript PHP 应用

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接