文档章节

在HTML中的下拉框中实现超连接

mickelfeng
 mickelfeng
发布于 09/20 17:09
字数 251
阅读 6
收藏 0
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <link rel="canonical" href="https://blog.csdn.net/weixin_34228617/article/details/86130280"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="renderer" content="webkit"/>
</head>

1.打开新页面

<select onChange="window.open(this.value)"> 
<option value="" selected>请选择 
<option value="http://www.baidu.com">百度 
<option value="http://www.sina.com">新浪 
</select><br>

2.打开新页面
<select name="select" onChange="linkChange(this);" > 
<option value="http://www.baidu.com" selected>百度 
<option value="http://www.sina.com">新浪 
</select>

<h2> 3.当前页面跳转 this one ok</h2>

<select id="stype" onChange="location.href=this.options[this.selectedIndex].getAttribute('data-href')">
    <option value="0" data-href="http://www.163.com">所有服务</option>
	<option value="1" data-href="http://www.163.com">1</option>
    <option value="2" data-href="http://www.163.com">2</option>
    <option value="4" data-href="http://www.163.com">4</option>
</select>


<h5> this one ok</h5>

<SELECT name="select" onChange="window.open(this.options[this.selectedIndex].value,target='_blank')">
	<OPTION value='http://www.sina.com' selected>网址1</OPTION>
	<OPTION value='http://www.sina.com'>网址2</OPTION>
	<OPTION value='http://www.sina.com'>网址3</OPTION>
</SELECT>



<script language="javascript">
function linkChange(selectObj)
{
	var value = selectObj.options[selectObj.selectedIndex].value;
	if (value != "")
	{
		window.open(value, "", "")
	}
}
</script>

 

© 著作权归作者所有

mickelfeng

mickelfeng

粉丝 237
博文 2803
码字总数 605868
作品 0
成都
高级程序员
私信 提问
程序猿必备的10款超炫酷HTML5 Canvas插件

  1.超炫酷HTML5 Canvas 3D旋转地球动画   这是一款基于HTML5 Canvas的3D地球模拟动画,动画以太空作为背景,地球在太空中旋转,同时我们也可以拖拽鼠标来从不同的角度观察地球。另外我们...

爱前端
2017/12/04
0
0
说说 Vue.js 中的 v-model 指令以及如何绑定表单元素

我们可以使用 Vue.js 中的 v-model 指令来完成表单数据的双向绑定。 1 基础用法 1.1 文本输入框(text) 这里演示了在文本输入框上输入的内容,会实时映射到绑定的数据上。 html: js: 效果...

deniro
2018/12/02
0
0
JQ实现三个Select下拉框互斥

目的:三个select下拉框中的内容相同,当其中一个下拉框选中了其中一个值后,隐藏掉另外两个下拉框中相同的值。 html: js:

wsy940822
2016/04/26
434
0
javascript实现二级联动下拉框

这个是简单也是最基本的下拉框联动的示例,这个示例主要针对那些只有二级联动,且第一级是固定的选项,第二级的内容也比较简单。这里使用了javascript来联动第二级下拉框。 1 2 3 4 New Doc...

teacheryang
2011/06/08
0
0
前端实现输入框input输入时,调用后台查询。

这几天做了一个前端html页面,基于bootstrap框架开发,里面有个需求就是在输入框中输入字母或者文字时,下拉框自动刷新模糊查询出的信息。最初我的想法是监控键盘上的按键输入,每次输入一个...

道之若无
2018/04/17
0
0

没有更多内容

加载失败,请刷新页面

加载更多

经典系统设计面试题解析:如何设计TinyURL(二)

原文链接:https://www.educative.io/courses/grokking-the-system-design-interview/m2ygV4E81AR 编者注:本文以一道经典的系统设计面试题:《如何设计TinyURL》的参考答案和解析为例,帮助...

APEMESH
今天
7
0
使用logstash同步MySQL数据到ES

概述   在生成业务常有将MySQL数据同步到ES的需求,如果需要很高的定制化,往往需要开发同步程序用于处理数据。但没有特殊业务需求,官方提供的logstash就很有优势了。   在使用logstas...

zxiaofan666
今天
10
0
X-MSG-IM-分布式信令跟踪能力

经过一周多的鏖战, X-MSG-IM的分布式信令跟踪能力已基本具备, 特点是: 实时. 只有要RX/TX就会实时产生信令跟踪事件, 先入kafka, 再入influxdb待查. 同时提供实时sub/pub接口. 完备. 可以完整...

dev5
今天
7
0
OpenJDK之CyclicBarrier

OpenJDK8,本人看的是openJDK。以前就看过,只是经常忘记,所以记录下 图1 CyclicBarrier是Doug Lea在JDK1.5中引入的,作用就不详细描述了,主要有如下俩个方法使用: await()方法,如果当前线...

克虏伯
今天
8
0
实战项目-学成在线(八)

在前后端分离架构中,服务层被拆分成了很多的微服务,微服务的信息如何管理?Spring Cloud中提供服务注册中心来管理微服务信息。 注册中心作用: 1、微服务数量众多,要进行远程调用就需要知...

lianbang_W
今天
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部