Select标签加超链接的方法

  • A+
所属分类:web前端
广告也精彩

select 标签可创建单选或多选菜单,很多时候需要实现链接跳转,下面是三种实现方法:

第一种方法:

  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4. <title>select加链接</title>
  5. </head>
  6. <body>
  7. <SCRIPT language=javascript>
  8. <!--
  9. // open the related site windows
  10. function mbar(sobj) {
  11. var docurl =sobj.options[sobj.selectedIndex].value;
  12. if (docurl != "") {
  13. open(docurl'_blank');
  14. sobj.selectedIndex=0;
  15. sobj.blur();
  16. }
  17. }
  18. //-->
  19. </SCRIPT>
  20. <Select onchange=mbar(this) name="select">
  21. <OPTION selected>=== 合作伙伴 ===</OPTION>
  22. <OPTION value="http://www.baidu.com">百度</OPTION>
  23. <OPTION value="http://www.163.com">网易</OPTION>
  24. <OPTION value="http://www.flash8.net/">闪吧</OPTION>
  25. </Select>
  26. </body>
  27. </html>

第二种方法:

  1. <select name="pageselect" onchange="self.location.href=options[selectedIndex].value" >
  2. <OPTION value="http://www.baidu.com">百度</OPTION>
  3. <OPTION value="http://www.163.com">网易</OPTION>
  4. </select>

第三种方法:带跳转按钮

  1. <html><head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  3. <title>select选择-按钮跳转</title>
  4. <script type="text/javascript">
  5. function setsubmit()
  6. {
  7. if(mylink.value == 0)
  8. window.location='http://www.baidu.com';
  9. if(mylink.value == 1)
  10. window.location='http://www.163.com';
  11. if(mylink.value == 2)
  12. window.location='http://www.sina.com';
  13. }
  14. </script>
  15. </head>
  16. <body>
  17. <select name="mylink" id="mylink">
  18. <OPTION value="0">百度</OPTION>
  19. <OPTION value="1">网易</OPTION>
  20. <OPTION value="2">新浪</OPTION>
  21. </select>
  22. <input type="button" id="btn" value="提交" onclick="setsubmit(this)" />
  23. </body>
  24. </html>

学点技术备用。

  • 我的微信
  • 这是我的微信扫一扫
  • weinxin
  • 我的微信公众号
  • 我的微信公众号扫一扫
  • weinxin
广告也精彩

发表评论

您必须登录才能发表评论!