HTML中怎么给一个按钮添加两个超链接

deanscl 2019-07-17 02:41:32
请问怎么实现给一个按钮添加两个超链接，一个单击在内联框架中打开，一个双击在新页面中打开
...全文
2221 10 打赏 收藏 转发到动态 举报
写回复
用AI写文章
10 条回复
切换为时间正序
请发表友善的回复…
发表回复
deanscl 2019-07-17
  • 打赏
  • 举报
 回复
引用 9 楼 天际的海浪的回复:
你没有引入jquery
引用 7 楼 deanscl 的回复:
[quote=引用 6 楼 天际的海浪 的回复:] 你没有引入jquery
谢谢⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄，请问你知道怎么让链接在内联框架打开吗，我像这样写了以后，单击按钮是重新打开了一个界面
document.getElementById("iframe 的 id").src = "地址" [/quote] 我写出来了 o(*≧▽≦)ツ ~ ┴┴谢谢你
天际的海浪 2019-07-17
  • 打赏
  • 举报
 回复
你没有引入jquery
引用 7 楼 deanscl 的回复:
引用 6 楼 天际的海浪 的回复:
你没有引入jquery
谢谢⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄，请问你知道怎么让链接在内联框架打开吗，我像这样写了以后，单击按钮是重新打开了一个界面
document.getElementById("iframe 的 id").src = "地址"
deanscl 2019-07-17
  • 打赏
  • 举报
 回复
引用 4 楼 潇湘忆梦的回复:
[quote=引用 3 楼 deanscl 的回复:]
[quote=引用 1 楼 潇湘忆梦的回复:]jquery的dblclick事件和click事件

参考下：https://blog.csdn.net/qq_30868289/article/details/79484322

那怎么绑超链接吖，我用a标签和<button οnclick="window.open('http://www.baidu.com')">链接</button>试了一下，都不对[/quote]


<input id="btnclick" type="button" value="button" />

<script>

$(function () {
//定义setTimeout执行方法
var TimeFn = null;
$('#btnclick').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function () {
//do function在此处写单击事件要执行的代码
window.location.href = "https://www.baidu.com";
}, 300);
});

$('#btnclick').dblclick(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
window.location.href = "https://cn.bing.com";
//https://cn.bing.com
})
});
</script>[/quote] 超级谢谢你(〃ﾉωﾉ)
deanscl 2019-07-17
  • 打赏
  • 举报
 回复
引用 6 楼 天际的海浪 的回复:
你没有引入jquery
谢谢⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄，请问你知道怎么让链接在内联框架打开吗，我像这样写了以后，单击按钮是重新打开了一个界面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>

<!-- 引入page-index -->
<link rel="stylesheet" type="text/css" href="page-index.css"/>
</head>

<body>
<!-- 头 -->
<div class="header w">

<!-- title -->
<div class="logo">
<img src="title1.png" alt="网站的logo"/>
</div>
</div>


<!-- 内容 -->
<div class="content">
<!-- 地图 -->
<div class="map">

<!-- javascript部分，按钮实现 -->
<!-- 故宫 -->
<input id="btnclick" class="btn02" type="button" value="button" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(function () {
//定义setTimeout执行方法
var TimeFn = null;
$('#btnclick').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function () {
//do function在此处写单击事件要执行的代码
window.location.href = "file:///C:/Users/iknos/Desktop/homework/palace.html";
}, 300);
});

$('#btnclick').dblclick(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
window.open('https://baike.baidu.com/item/%E6%B2%88%E9%98%B3%E6%95%85%E5%AE%AB/281771?fr=aladdin');

})
});
</script>

<!-- 北陵 -->
<input id="btnclick1" class="btn01" type="button" value="button" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(function () {
//定义setTimeout执行方法
var TimeFn = null;
$('#btnclick1').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function () {
//do function在此处写单击事件要执行的代码
window.location.href = "file:///C:/Users/iknos/Desktop/homework/grave%20yard.html";//https://cn.bing.com
}, 300);
});

$('#btnclick1').dblclick(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
window.open('https://baike.baidu.com/item/%E5%8C%97%E9%99%B5%E5%85%AC%E5%9B%AD/2317870');

})
});
</script>
</div>

<!-- 文本框 -->
<div class="artical">
<iframe class="artical" stc="" name="text"></iframe>
</div>
</div>




</body>
天际的海浪 2019-07-17
  • 打赏
  • 举报
 回复
你没有引入jquery
deanscl 2019-07-17
  • 打赏
  • 举报
 回复
引用 4 楼 潇湘忆梦 的回复:
[quote=引用 3 楼 deanscl 的回复:]
[quote=引用 1 楼 潇湘忆梦的回复:]jquery的dblclick事件和click事件

参考下：https://blog.csdn.net/qq_30868289/article/details/79484322

那怎么绑超链接吖，我用a标签和<button οnclick="window.open('http://www.baidu.com')">链接</button>试了一下，都不对[/quote]


<input id="btnclick" type="button" value="button" />

<script>

$(function () {
//定义setTimeout执行方法
var TimeFn = null;
$('#btnclick').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function () {
//do function在此处写单击事件要执行的代码
window.location.href = "https://www.baidu.com";
}, 300);
});

$('#btnclick').dblclick(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
window.location.href = "https://cn.bing.com";
//https://cn.bing.com
})
});
</script>[/quote]我像这样写了之后，点击按钮没有反应哎
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>

<!-- 引入page-index -->
<link rel="stylesheet" type="text/css" href="page-index.css"/>
</head>

<body>
<!-- 头 -->
<div class="header w">

<!-- title -->
<div class="logo">
<img src="title1.png" alt="网站的logo"/>
</div>
</div>


<!-- 内容 -->
<div class="content">
<!-- 地图 -->
<div class="map">
<button class="btn02" name="palace"> </button>
<button class="btn01" name="grave yard"> </button>

<!-- javascript部分，按钮实现 -->
<input id="btnclick" type="button" value="button" />
<script type="text/javascript">
$(function () {
//定义setTimeout执行方法
var TimeFn = null;
$('#btnclick').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function () {
//do function在此处写单击事件要执行的代码
window.location.href = "https://www.baidu.com";
}, 300);
});

$('#btnclick').dblclick(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
window.location.href = "https://cn.bing.com";
//https://cn.bing.com
})
});
</script>

</div>

<!-- 文本框 -->
<div class="artical">
<iframe class="artical" stc="" name="text"></iframe>
</div>
</div>




</body>
潇湘忆梦 2019-07-17
  • 打赏
  • 举报
 回复
引用 3 楼 deanscl 的回复:
[quote=引用 1 楼 潇湘忆梦的回复:]jquery的dblclick事件和click事件

参考下：https://blog.csdn.net/qq_30868289/article/details/79484322

那怎么绑超链接吖，我用a标签和<button οnclick="window.open('http://www.baidu.com')">链接</button>试了一下，都不对[/quote]


<input id="btnclick" type="button" value="button" />

<script>

$(function () {
//定义setTimeout执行方法
var TimeFn = null;
$('#btnclick').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function () {
//do function在此处写单击事件要执行的代码
window.location.href = "https://www.baidu.com";
}, 300);
});

$('#btnclick').dblclick(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
window.location.href = "https://cn.bing.com";
//https://cn.bing.com
})
});
</script>
deanscl 2019-07-17
  • 打赏
  • 举报
 回复
引用 1 楼 潇湘忆梦的回复:
jquery的dblclick事件和click事件 参考下：https://blog.csdn.net/qq_30868289/article/details/79484322
那怎么绑超链接吖，我用a标签和<button οnclick="window.open('http://www.baidu.com')">链接</button>试了一下，都不对
天际的海浪 2019-07-17
  • 打赏
  • 举报
 回复
单击事件最好延时执行，因为双击操作中包含单击
潇湘忆梦 2019-07-17
  • 打赏
  • 举报
 回复
jquery的dblclick事件和click事件 参考下：https://blog.csdn.net/qq_30868289/article/details/79484322
html表单中按钮添加超链接,JS 实现点击按钮实现超链接功能
通过 JS，直接改变报表中相关参数的参数值，报表画面呈现参数值对应的内容。2.1 准备数据集新建一个决策报表，新建数据集ds1，SQL语句为：SELECT * FROM 销量 where 地区='${area}'，其中有一个数据集参数area ，如下图所示：2.2 设计报表1)在 body 中添加两个「按钮控件」和一个报表块，「按钮控件」名称分别为华东、华北，如下图所示：2)将 ds1 数据集...
html5中加下划线,为超链接添加下划线
如何给有超链接的文本加上下划线这方法很多的，在文字上做超链接的话，加文本框后打字，然后点文本框的虚框加超链接就没有下划线。 加图片，或小图标，按钮之类的，在这上加超链接。 在大图片上的某个位置加超链，在这个位置上画一个矩形，或其它什么图形。html超链接更改颜色和去掉下划线定义两个class，一个功能是使超链接呈白色无下划线，另一个是使超链接呈超链接下划线可以使用“text-decoration:...
如何在html中把按钮设置为超链接
如何给按钮加上链接功能 脚本说明: 把如下代码加入区域中     按钮链接乾坤大挪移  作为一个小技巧，暂时归类到ASP中。 在设计网站的时，我们可能会想把链接做成按钮的样子，按钮做成链接的样子。下面说一下我的方法。 1、按钮做成链接(图片)的样子 提交按钮 提交链接提交 重置按钮 重置链接重置 普通按钮 普通链接链接 至于图片也一样把a标签换成img
图片中加入超链接html代码,html网页超链接代码 怎样用HTML代码在图片插入超链接...
HTML使用定义锚创造链接，可用于文本，图片，HTML元素…… 一，将文本作为超链接 文本 二，将图像作为超链接 三，将书签作为超链接 (在网页上显示的)书签文本 ① 在同文档中创建指向该锚的链接。 文本 ② 在其他页面创建指向该锚的链接。我有两个html文件在同一个文件夹里。一个index. 一个page、 如果我要在iHTML超链接可以用a标签来设置。新建html文档，在body标签中添加a标...
html5按钮超链接一个文本文档,怎么做word文档超链接
怎么做word文档超链接超链接，常见于网页制作中，是将两个网页之间建立链接关系，即当点击一个A对象的时，自动跳转到另一个B对象的位置，从而快速查阅网页内容。接下来小编为大家推荐的是word文档超链接相关内容，仅供参考。在Word中，常用超链接方法有两种：一是文档内部的超链接，二是，文档外部的超链接。下面分别进行介绍。【一 】文档外部的超链接文档外部的超链接最常见于文档目录。将目录与内容进行链接，用...
CSS

61,112

社区成员

60,730

社区内容

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章