编程 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 相关文章推荐

javascript 写类方式之四

Jul 05 Javascript

jQuery JSON的解析方式分享

Apr 05 Javascript

JavaScript数值转换的三种方式总结

Jul 31 Javascript

解决bootstrap中modal遇到Esc键无法关闭页面

Mar 09 Javascript

Jquery+Ajax+PHP+MySQL实现分类列表管理(下)

Oct 28 Javascript

js removeChild 方法深入理解

Aug 16 Javascript

网络传输协议（http协议）

Nov 18 Javascript

Vue的移动端多图上传插件vue-easy-uploader的示例代码

Nov 27 Javascript

浅谈React组件之性能优化

Mar 02 Javascript

vue element table 表格请求后台排序的方法

Sep 28 Javascript

从零撸一个pc端vue的ui组件库( 计数器组件 )

Aug 08 Javascript

小程序实现录音上传功能

Nov 22 Javascript

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调用dll的实例操作动画与代码分享

2012/08/14 PHP

php教程之phpize使用方法

2014/02/12 PHP

Add a Table to a Word Document

2007/06/15 Javascript

JavaScript 学习笔记（十一）

2010/01/19 Javascript

Extjs入门之动态加载树代码

2010/04/09 Javascript

jquery对表单操作2

2011/04/06 Javascript

jquery attr 设定src中含有&（宏）符号问题的解决方法

2011/07/26 Javascript

jquery将一个表单序列化为一个对象的方法

2013/12/02 Javascript

javascript动态添加、修改、删除对象的属性与方法详解

2014/01/27 Javascript

深入理解javascript原型链和继承

2014/09/23 Javascript

js实现字符串转日期格式的方法

2015/05/20 Javascript

jquery获取select选中值的方法分析

2015/12/22 Javascript

Js+Ajax,Get和Post在使用上的区别小结

2016/06/08 Javascript

AngularJS使用自定义指令替代ng-repeat的方法

2016/09/17 Javascript

JS限定手机版中图片大小随分辨率自动调整的方法

2016/12/05 Javascript

jquery 实现复选框的全选操作实例代码

2017/01/24 Javascript

js实现三级联动效果（简单易懂）

2017/03/27 Javascript

canvas简单快速的实现知乎登录页背景效果

2017/05/08 Javascript

详解Vue快速零配置的打包工具——parcel

2018/01/16 Javascript

Vue拖拽组件开发实例详解

2018/05/11 Javascript

详解小程序rich-text对富文本支持方案

2018/11/28 Javascript

微信小程序Echarts图表组件使用方法详解

2019/06/25 Javascript

详解微信小程序中var、let、const用法与区别

2020/01/11 Javascript

vue 中this.$set 动态绑定数据的案例讲解

2021/01/29 Vue.js

Django框架下在URLconf中指定视图缓存的方法

2015/07/23 Python

python中安装Scrapy模块依赖包汇总

2017/07/02 Python

python itchat给指定联系人发消息的方法

2019/06/11 Python

python Canny边缘检测算法的实现

2020/04/24 Python

python多线程实现同时执行两个while循环的操作

2020/05/02 Python

python输出国际象棋棋盘的实例分享

2020/11/26 Python

python的dict判断key是否存在的方法

2020/12/09 Python

临时用工协议书范本

2014/10/29 职场文书

初婚初育证明范本

2014/11/24 职场文书

小学生通知书评语

2014/12/31 职场文书

六一儿童节开幕词

2015/01/29 职场文书

python基础之函数的定义和调用

2021/10/24 Python