javascript使用switch case实现动态改变超级链接文字及地址


Posted in Javascript onDecember 16, 2014

代码很简单,我这里就不多废话了,小伙伴们直接看源码吧。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

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

<title>动态改变超级链接文字及地址</title>

<link href="css/css.css" rel="stylesheet" type="text/css">

<script type="text/javascript" language="javascript">

function netbankusername()

{

values=form.bankname.options[form.bankname.selectedIndex].value;

texts=form.bankname.options[form.bankname.selectedIndex].text;

  switch (form.bankname.selectedIndex)

    {

       case 1:

        //document.links[0].href="http://www.cmbchina.com/";

        //shownetbank1.innerHTML="http://www.cmbchina.com/(招商银行)";

        document.links[0].href=values;

        shownetbank1.innerHTML=values+"("+texts+")";

        break;

       case 2:

           //document.links[0].href="http://www.cib.com.cn/netbank/netbank.portal";

        //shownetbank1.innerHTML="http://www.cib.com.cn/netbank/netbank.portal(兴业银行)";

        document.links[0].href=values;

        shownetbank1.innerHTML=values+"("+texts+")";

        break;

        default:

            alert(form.bankname.selectedIndex);

        break;

    }

}

</script>

</head>

<body>

<form action="cardinfo_action.asp?action=insert" method="post" name="form" id="form">

<table width="200" border="0">  

<tr>    

<td>请选择</td>

<td>

<select name="bankname" onChange="netbankusername()" id="bankname">

<option value="">请选择</option>

<option value="http://www.cmbchina.com/">招商银行</option>

<option value="http://www.cib.com.cn/netbank/netbank.portal">兴业银行</option>

<option value="http://www.baidu.com">其他</option>

</select></td>  

</table>

</form>

<div style="border:1px solid #ccc;margin:1px;width:600px;height:20px;"><a href="#" target="_blank" id="shownetbank1" name="shownetbank1">未选择银行</a></div>

</body>

</html>

是不是超级简单实用呢。。。经常看看比较大的站,还是可以解除到不少好东西的。

Javascript 相关文章推荐
Use Word to Search for Files
Jun 15 Javascript
javascript重写alert方法的实例代码
Mar 29 Javascript
Jquery1.9.1源码分析系列(六)延时对象应用之jQuery.ready
Nov 24 Javascript
jQuery移动web开发中的页面初始化与加载事件
Dec 03 Javascript
JS排序方法(sort,bubble,select,insert)代码汇总
Jan 30 Javascript
Bootstrap进度条组件知识详解
May 01 Javascript
JS简单实现仿百度控制台输出信息效果
Sep 04 Javascript
JS实现改变HTML上文字颜色和内容的方法
Dec 30 Javascript
js中的触发事件对象event.srcElement与event.target详解
Mar 15 Javascript
jQuery手风琴的简单制作
May 12 jQuery
用JS编写一个函数,返回数组中重复出现过的元素(实例)
Sep 14 Javascript
小程序实现抽奖动画
Apr 16 Javascript
浅谈Javascript变量作用域问题
Dec 16 #Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
Dec 16 #Javascript
javascript arguments使用示例
Dec 16 #Javascript
javascript实现日期格式转换
Dec 16 #Javascript
javascript实现禁止复制网页内容
Dec 16 #Javascript
node.js中的fs.rmdirSync方法使用说明
Dec 16 #Javascript
node.js中的fs.rmdir方法使用说明
Dec 16 #Javascript
You might like
phpcms手机内容页面添加上一篇和下一篇
2015/06/05 PHP
当鼠标移动到图片上时跟随鼠标显示放大的图片效果
2013/06/06 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
2013/07/01 Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
2013/09/22 Javascript
javascript数组遍历for与for in区别详解
2014/12/04 Javascript
javascript实现图像循环明暗变化的方法
2015/02/25 Javascript
浅谈setTimeout 与 setInterval
2015/06/23 Javascript
jQuery链式调用与show知识浅析
2016/05/11 Javascript
Vue自定义指令介绍(2)
2016/12/08 Javascript
js实现图片上传预览原理分析
2017/07/13 Javascript
详解基于electron制作一个node压缩图片的桌面应用
2019/01/29 Javascript
JS中async/await实现异步调用的方法
2019/08/28 Javascript
vue项目中使用vue-layer弹框插件的方法
2020/03/11 Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
2020/09/21 Javascript
[03:36]2015国际邀请赛第二日现场精彩集锦
2015/08/06 DOTA
[02:38]2018DOTA2亚洲邀请赛赛前采访-VGJ.T
2018/04/03 DOTA
用Python计算三角函数之acos()方法的使用
2015/05/15 Python
Python中if __name__ == '__main__'作用解析
2015/06/29 Python
利用python发送和接收邮件
2016/09/27 Python
Python实现定时备份mysql数据库并把备份数据库邮件发送
2018/03/08 Python
python实现抖音点赞功能
2019/04/07 Python
win10子系统python开发环境准备及kenlm和nltk的使用教程
2019/10/14 Python
Python如何在循环内使用list.remove()
2020/06/01 Python
用python按照图像灰度值统计并筛选图片的操作(PIL,shutil,os)
2020/06/04 Python
CSS3悬停效果案例应用
2012/11/21 HTML / CSS
台湾最大银发乐活百货:乐龄网
2018/05/21 全球购物
英国豪华家具和经典家居饰品购物网站:OKA
2020/06/05 全球购物
师范应届生教师求职信
2013/11/05 职场文书
办公室综合文员岗位职责范本
2014/02/13 职场文书
高级编程求职信模板
2014/02/16 职场文书
聚美优品励志广告词
2014/03/14 职场文书
优秀教师个人材料
2014/12/15 职场文书
小学安全工作总结2015
2015/05/18 职场文书
2016年过年放假安排通知
2015/08/18 职场文书
配置nginx 重定向到系统维护页面
2021/06/08 Servers
Redis全局ID生成器的实现
2022/06/05 Redis