编程 Javascript

javascript实现跳转菜单的具体方法

Posted in Javascript onJuly 05, 2013

传统

这里要做的是，省略Go There按钮，选择菜单项后，直接跳转。

Html代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>转移菜单</title>  
<script type="text/javascript" src="转移菜单.js"></script>  
</head>  
<body>  
<form>  
  <select id="newLocation">  
    <option selected="selected" value="">Select a topic</option>  
    <option value="topic1.html">topic1</option>  
    <option value="topic2.html">topic2</option>  
    <option value="topic3.html">topic3</option>  
    <option value="topic4.html">topic4</option>  
    <option value="topic5.html">topic5</option>  
  </select>  
  <!--当浏览器不支持javascript或者禁用脚本运行时被调用-->  
 <noscript>  
    <input type="submit" value="Go There!"/>  
 </noscript>  
</form>  
</body>  
</html>

Javascript脚本

window.onload=initForm;  
//防止页面缓存，无法触发onload   
window.onunload=function(){}  
    function initForm(){  
        document.getElementById("newLocation").selectIndex=0;  
        document.getElementById("newLocation").onchange=jumpPage;  
        }  
    function jumpPage(){  
        var newLoc=document.getElementById("newLocation");  
        var newPage=newLoc.options[newLoc.selectedIndex].value;  
        if (newPage!=""){  
            window.location=newPage;  
            }  
        }

javascript实现跳转菜单的具体方法

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Prototype 学习工具函数学习($方法)

Jul 12 Javascript

jquery实现类似淘宝星星评分功能有截图

Sep 15 Javascript

JavaScript模拟实现继承的方法

Mar 30 Javascript

为什么JS中eval处理JSON数据要加括号

Apr 13 Javascript

js实现兼容性好的微软官网导航下拉菜单效果

Sep 07 Javascript

JS+CSS相对定位实现的下拉菜单

Oct 06 Javascript

JS获取鼠标坐标位置实例分析

Jan 20 Javascript

Angularjs中UI Router的使用方法

May 14 Javascript

JQuery 传送中文乱码问题的简单解决办法

May 24 Javascript

JS 创建对象的模式实例小结

Apr 28 Javascript

原生JavaScript实现随机点名表

Jan 14 Javascript

vue中axios封装使用的完整教程

Mar 03 Vue.js

JavaScript获取和设置CheckBox状态的简单方法

Jul 05 #Javascript

JavaScript 操作table,可以新增行和列并且隔一行换背景色代码分享

Jul 05 #Javascript

JS 精确统计网站访问量的实例代码

Jul 05 #Javascript

如何使用jQuery Draggable和Droppable实现拖拽功能

Jul 05 #Javascript

基于JavaScript 下namespace 功能的简单分析

Jul 05 #Javascript

javascript基础之查找元素的详细介绍(访问节点)

Jul 05 #Javascript

js文件缓存之版本管理详解

Jul 05 #Javascript

You might like

PHP函数nl2br()与自定义函数nl2p()换行用法分析

2016/04/02 PHP

js以对象为索引的关联数组

2010/07/04 Javascript

Jquery刷新页面背景图片随机变换的实现方法

2013/03/15 Javascript

jQuery实现Div拖动+键盘控制综合效果的方法

2015/03/10 Javascript

浅谈javascript中的Function和Arguments

2016/08/30 Javascript

ES6概念 ymbol.for()方法

2016/12/25 Javascript

JS 实现计算器详解及实例代码（一）

2017/01/08 Javascript

详解node如何让一个端口同时支持https与http

2017/07/04 Javascript

JS中Safari浏览器中的Date

2017/07/17 Javascript

详解vue渲染函数render的使用

2017/12/12 Javascript

Vue2.0中集成UEditor富文本编辑器的方法

2018/03/03 Javascript

JavaScript实现选项卡效果的分析及步骤

2019/04/16 Javascript

基于nodejs的微信JS-SDK简单应用实现

2019/05/21 NodeJs

nodejs dgram模块广播+组播的实现示例

2019/11/04 NodeJs

python使用rabbitmq实现网络爬虫示例

2014/02/20 Python

分享一个常用的Python模拟登陆类

2015/03/29 Python

Python使用functools模块中的partial函数生成偏函数

2016/07/02 Python

TensorFlow实现Softmax回归模型

2018/03/09 Python

Python实现自定义函数的5种常见形式分析

2018/06/16 Python

利用Python查看微信共同好友功能的实现代码

2019/04/24 Python

python retrying模块的使用方法详解

2019/09/25 Python

pygame实现贪吃蛇游戏（上）

2019/10/29 Python

通过实例学习Python Excel操作

2020/01/06 Python

python实现斗地主分牌洗牌

2020/06/22 Python

python 下划线的不同用法

2020/10/24 Python

python 操作excel表格的方法

2020/12/05 Python

Python绘制词云图之可视化神器pyecharts的方法

2021/02/23 Python

彻底弄明白CSS3的Media Queries(跨平台设计)

2010/07/27 HTML / CSS

使用html5制作loading图的示例

2014/04/14 HTML / CSS

英国护发和美妆在线商店：Klip Shop

2019/03/24 全球购物

英国电气世界：Electrical World

2019/09/08 全球购物

事业单位辞职信范文

2014/01/19 职场文书

电气自动化个人求职信范文

2014/02/03 职场文书

开门红主持词

2014/04/02 职场文书

应届生自荐书

2014/06/23 职场文书

Linux在两个服务器直接传文件的操作方法

2022/08/05 Servers