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


Posted in Javascript onJuly 05, 2013

传统

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

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

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

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 篱式条件判断
Aug 22 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(二)人物行走的实现
Jan 23 Javascript
如何实现textarea里的不同文本显示不同颜色
Jan 20 Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
Aug 12 Javascript
仿百度联盟对联广告实现代码
Aug 30 Javascript
seajs学习教程之基础篇
Oct 20 Javascript
深入理解vue Render函数
Jul 19 Javascript
详解利用Angular实现多团队模块化SPA开发框架
Nov 27 Javascript
Node.js应用设置安全的沙箱环境
Apr 23 Javascript
在小程序/mpvue中使用flyio发起网络请求的方法
Sep 13 Javascript
javascript数组去重方法总结(推荐)
Mar 20 Javascript
Vue左滑组件slider使用详解
Aug 21 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
使用php4加速网络传输
2006/10/09 PHP
详解PHP的Yii框架中自带的前端资源包的使用
2016/03/31 PHP
PHP二维数组矩形转置实例
2016/07/20 PHP
Jquery 最近浏览过的商品的功能实现代码
2010/05/14 Javascript
Yii-自定义删除确认弹框(zyd)jquery实现代码
2013/03/04 Javascript
JS+CSS 制作的超级简单的下拉菜单附图
2013/11/22 Javascript
关于jquery中全局函数each使用介绍
2013/12/10 Javascript
js的延迟执行问题分析
2014/06/23 Javascript
avascript中的自执行匿名函数应用示例
2014/09/15 Javascript
JQuery设置时间段下拉选择实例
2014/12/30 Javascript
JS实现带缓冲效果打开、关闭、移动一个层的方法
2015/05/09 Javascript
谈谈JavaScript中function多重理解
2015/08/28 Javascript
js return返回多个值,通过对象的属性访问方法
2017/02/21 Javascript
js判断手机系统是android还是ios
2017/03/07 Javascript
MVVM 双向绑定的实现代码
2018/06/21 Javascript
对Vue table 动态表格td可编辑的方法详解
2018/08/28 Javascript
微信小程序与webview交互实现支付功能
2019/06/07 Javascript
Vue+Bootstrap收藏(点赞)功能逻辑与具体实现
2020/10/22 Javascript
[09:37]DOTA2卡尔工作室 英雄介绍圣堂刺客篇
2013/06/13 DOTA
[01:03:37]Secret vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
使用PDB模式调试Python程序介绍
2015/04/05 Python
python matplotlib画图实例代码分享
2017/12/27 Python
Python+matplotlib实现计算两个信号的交叉谱密度实例
2018/01/08 Python
pandas.loc 选取指定列进行操作的实例
2018/05/18 Python
python3 读取Excel表格中的数据
2018/10/16 Python
利用python实现在微信群刷屏的方法
2019/02/21 Python
详解Python3 对象组合zip()和回退方式*zip
2019/05/15 Python
python pyinstaller打包exe报错的解决方法
2019/11/02 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
Python读取pdf表格写入excel的方法
2021/01/22 Python
让IE下支持Html5的placeholder属性的插件
2014/09/02 HTML / CSS
应届毕业生的自我鉴定
2013/11/13 职场文书
即将毕业大学生自荐信
2014/01/24 职场文书
买房委托公证书
2014/04/08 职场文书
管理建议书范文
2014/05/13 职场文书
2014年十一国庆节爱国演讲稿
2014/09/23 职场文书