网络编程 | 站长之家 | 网页制作 | 图形图象 | 操作系统 | 冲浪宝典 | 软件教学 | 网络办公 | 邮件系统 | 网络安全 | 认证考试 | 系统进程

Firefox | IE | Maxthon | 迅雷 | 电驴 | BitComet | FlashGet | QQ | QQ空间 | Vista | 输入法 | Ghost | Word | Excel | wps | Powerpoint

asp | .net | php | jsp | Sql | c# | Ajax | xml | Dreamweaver | FrontPages | Javascript | css | photoshop | fireworks | Flash | Cad | Discuz!

当前位置 > 网站建设学院 > 网页制作 > Javascript

网页制作：Dreamweaver教程,FrontPages教程,Javascript教程,HTML教程,CSS教程,心得技巧,DHTML教程,网页特效,Discuz!论坛

本月文章推荐

Javascript实例教程(2) 创建折叠式导航菜单

发表日期：2004-1-30

为了创建折叠式的导航菜单，你可以在网页的最前面部分以下代码：

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

function formHandler()

{

var URL = document.form.site.options

[document.form.site.selectedIndex].value;

window.location.href = URL;

// End -->

}

</SCRIPT>

那在网页上如何调用呢？以下是具体代码：

<CENTER>

<FORM name = "form">

<SELECT NAME="site" SIZE=1 onChange ="formHandler()">

<OPTION VALUE="">连接到….

<OPTION VALUE="http://www.pconline.com.cn">太平洋电脑网

<OPTION VALUE="http://cn.yahoo.com">中文雅虎

<OPTION VALUE="http://www.263.net">263网站

<OPTION VALUE="http://www.usnews.com">美国在线

<OPTION VALUE="http://www.neworiental.org">北京新东方

</SELECT>

</FORM>

</CENTER>

下面是全部的代码：

<head>

<title>Untitled Document</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

function formHandler()

{

var URL = document.form.site.options

[document.form.site.selectedIndex].value;

window.location.href = URL;

// End -->

}

</SCRIPT>

</head>

<FORM name = "form">

<SELECT NAME="site" SIZE=1 onChange ="formHandler()">

<option value="">连接到…. </option>

<option value="http://www.pcedu.com.cn">太平洋网络学院</option>

<option value="http://cn.yahoo.com">中文雅虎 </option>

<option value="http://www.263.net">263网站 </option>

<option value="http://www.usnews.com">美国在线 </option>

<option value="http://www.neworiental.org">北京新东方 </option>

</SELECT>

</FORM>

效果实现：

上一篇：Javascript实例教程(1) 创建弹出式窗口人气:21525
下一篇：Javascript实例教程(3) 探测浏览器插件人气:17714

浏览全部Javascript实例教程的内容 Dreamweaver插件下载网页广告代码祝你圣诞节快乐 2009年新年快乐