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 相关文章推荐
List the Stored Procedures in a SQL Server database
Jun 20 Javascript
屏蔽Flash右键信息的js代码
Jan 17 Javascript
如何将php数组或者对象传递给javascript
Mar 20 Javascript
jquery.map()方法的使用详解
Jul 09 Javascript
javascript实现判断鼠标的状态
Jul 10 Javascript
Javascript 高性能之递归,迭代,查表法详解及实例
Jan 08 Javascript
Angular实现的日程表功能【可添加及隐藏显示内容】
Dec 27 Javascript
vue3.0 CLI - 2.1 -  component 组件入门教程
Sep 14 Javascript
使用 Node.js 实现图片的动态裁切及算法实例代码详解
Sep 29 Javascript
如何根据业务封装自己的功能组件
Apr 19 Javascript
Vue formData实现图片上传
Aug 20 Javascript
Vue最新防抖方案(必看篇)
Oct 30 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
评分9.0以上的动画电影,剧情除了经典还很燃
2020/03/04 日漫
深入理解PHP原理之Session Gc的一个小概率Notice
2011/04/12 PHP
php array_filter除去数组中的空字符元素
2020/06/21 PHP
详解PHP原生DOM对象操作XML的方法
2016/10/17 PHP
PHP Trait功能与用法实例分析
2020/06/03 PHP
jquery 必填项判断表单是否为空的方法
2008/09/14 Javascript
jquery 笔记 事件
2011/11/02 Javascript
Enter回车切换输入焦点实现思路与代码兼容各大浏览器
2014/09/01 Javascript
JavaScript常用标签和方法总结
2015/09/01 Javascript
Javascript实现前端简单的路由实例
2016/09/11 Javascript
jQuery实现checkbox列表的全选、反选功能
2016/11/24 Javascript
js document.getElementsByClassName的使用介绍与自定义函数
2016/11/25 Javascript
谈谈JavaScript中浏览器兼容问题的写法小议
2016/12/17 Javascript
使用jquery给新生的th绑定hover事件的实例
2017/02/10 Javascript
HTML5+Canvas调用手机拍照功能实现图片上传(下)
2017/04/21 Javascript
vue.js实现单选框、复选框和下拉框示例
2017/07/18 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
2018/09/25 Javascript
vue实现pdf文档在线预览功能
2019/11/26 Javascript
详解Node.js使用token进行认证的简单示例
2020/05/25 Javascript
[06:38]DOTA2怒掀电竞风暴 2013Chinajoy
2013/07/27 DOTA
使用Python中的cookielib模拟登录网站
2015/04/09 Python
Python如何实现转换URL详解
2019/07/02 Python
python实现最大优先队列
2019/08/29 Python
AUC计算方法与Python实现代码
2020/02/28 Python
keras和tensorflow使用fit_generator 批次训练操作
2020/07/03 Python
pycharm 实现复制一行的快捷键
2021/01/15 Python
爱尔兰电子产品购物网站:Komplett.ie
2018/04/04 全球购物
应届生幼儿园求职信
2013/11/12 职场文书
幼儿园保育员辞职信
2014/01/12 职场文书
软件项目开发计划书
2014/05/01 职场文书
2014党的群众路线教育实践活动总结材料
2014/10/31 职场文书
区域经理岗位职责
2015/02/02 职场文书
销售合作意向书范本
2015/05/08 职场文书
2016个人先进事迹材料范文
2016/03/01 职场文书
教你做个可爱的css滑动导航条
2021/06/15 HTML / CSS
【海涛DOTA】D-cup邀请赛NV.cn vs DT.Love
2022/04/01 DOTA