`
zhaoshijie
  • 浏览: 2265554 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

给按钮加上链接的功能

阅读更多
解决思路:
按钮属于控件级的对象,优先级比较高,所以不能象图片或文本一样直接加链接,只能通过按钮的单击事件调用脚本的方式来实现。
具体步骤:
    1.在原窗口打开链接

    <input type="button" 
value="闪吧" onClick="location=’http://www.flash8.net’">
    <button onClick="location.href=’http://www.flash8.net’">闪吧</button>
    <form action="http://www.flash8.net"><input type="submit" value="打开链接"></form>

    2.在新窗口中打开链接

    <input type="button" 
value="闪吧" onClick="window.open(’http://www.flash8.net’)">
    <button onClick="window.open(’http://www.flash8.net’)">闪吧</button>
    <form action="http://www.flash8.net" 
target="_blank"><input type="submit" value="打开链接"></form>

注意:onClick调用的代码里的引号在只有一重时可以单双嵌套,超过两重就必须用"\"号转义且转义的引号必须跟里层的引号一致,如:

<button onClick="this.innerHTML=’<font color=\’red\’>http://www.flash8.net</font>’">闪吧</button>



<button onClick=’this.innerHTML="<font color=\"red\">http://www.flash8.net</font>"’>闪吧</button>

而下面都是错误的写法:

<button onClick="this.innerHTML=’<font color=’red’>http://www.flash8.net</font>’">闪吧</button>

<button onClick="this.innerHTML=’<font color="red">http://www.flash8.net</font>’">闪吧</button>

<button onClick="this.innerHTML=’<font color=\"red\">http://www.flash8.net</font>’">闪吧</button>

提示:大部分属于window或document对象的方法和属性都可以省略前缀window或document,比如说本例中的location.href(location.href又可以简写为location,因为location的默认对象为href)就是window.location.href或document.location.href的省略式写法。
技巧:本例中还可以用下面的方法来代替location.href
location.replace(url)
location.assign(url)
navigate(url)
特别提示
第一步中的代码运行后,单击按钮将跳转到链接目标。而第二步的在单击按钮后将在新窗口中打开链接。

特别说明

本例主要是通过用onClick捕获用户在按钮上的单击事件,然后调用location对象的href方法或window对象的open方法来打开链接。另外一个技巧是通过提交表单来实现链接功能,按钮必须是type=submit类型的按钮,表单的action值就是链接目标,target值就是链接打开的目标方式。
分享到:
评论

相关推荐

    软件按钮包

    在IT行业中,设计和开发用户界面(UI)是至关重要的环节,而软件中的按钮作为UI设计的核心元素之一,起着连接用户与应用交互的关键作用。"软件按钮包"提供了丰富的按钮图片素材,使得UI设计师和开发者能够快速、高效...

    win32应用程序加上录音功能

    在开发Windows应用程序时,有时需要集成录音功能,特别是在创建多媒体应用或者通信软件时。本教程以Visual Studio 2005...提供的压缩包文件“给程序加上录音的功能”可能包含了实现这一功能的示例代码,可以参考学习。

    C++逃跑按钮小案列源码

    在C++编程中,"逃跑按钮"通常是指一个应用程序中的功能,允许用户快速退出或关闭程序,例如在紧急情况下。这个小案例可能涉及到GUI(图形用户界面)编程,使用了某种库来创建用户界面和处理事件,如点击事件。下面...

    NaviCat连接时提示不支持远程连接的MySql数据库解决方法

    NaviCat是一款功能丰富的MySQL数据库管理工具,它提供了直观的界面和多种连接方式。当遇到提示“不支持远程连接”的情况时,可以尝试通过HTTP代理来建立连接。以下是具体的解决步骤: 1. **下载与安装NaviCat**: ...

    在listview中添加按钮,并监听相应事件,可以加上自己的方法.zip

    在这个主题中,我们将探讨如何在ListView的每一项中添加按钮,并监听这些按钮的点击事件,以便实现自定义的功能。以下是一个详细的过程: 1. **创建ListView布局** 首先,我们需要创建一个XML布局文件,用于定义...

    ArcGIS与Oracle数据库连接.docx

    2. **添加数据库连接**:通过“数据库连接”选项卡中的“添加数据库连接”按钮,新建一个Oracle数据库连接。 - 实例名:使用IP地址或机器名加上“/”和数据库空间名。 - 注意:如果Oracle客户端版本安装不正确或...

    jsp的数据库连接页面

    ### JSP的数据库连接页面知识点解析 #### 一、JSP与数据库交互的基本概念 Java Server Pages (JSP) 是一种基于Java技术的服务器端网页技术,它允许开发者创建动态生成的网页。JSP文件本质上是HTML文件加上一些Java...

    如何在程序中启动 NT 的【拨号连接】对话框?

    - 通过在命令后面加上`-d`选项,可以打开“拨号连接”对话框供用户进行配置。 - 使用`Shell`函数来执行上述命令。 #### 示例代码分析 以下是一个简单的VB代码示例,演示了如何在用户点击按钮时启动“拨号连接”...

    西门子电气说明(按钮)

    对于需要特殊配置的情况,如安装三个触点块或者一个灯座加上两个触点块,需要使用**3位支架**(3SB3901-0AB 或 3SB3901-0AC)来辅助安装。 #### 四、铭文系统 - **铭文**可以通过激光直接刻在元件表面、铭牌或背板...

    Windows 8.1怎么连接第二个显示器或投影仪呢?.docx

    本文将详细介绍如何连接额外的显示器,并提供设置屏幕布局和使用多显示器功能的指导。 首先,确保你的电脑具有合适的端口来连接显示器或投影仪,如DVI、VGA或HDMI。某些电脑可能还支持无线连接,如Miracast,可以将...

    网络连接ping工具

    标题中的“网络连接ping工具”指的是一个用于网络诊断的实用程序,主要功能是通过发送ICMP(Internet Control Message Protocol)回显请求数据包到目标IP地址,并接收回应,以此来检查网络连接是否通畅。在Windows...

    Xshell-5.0.1339p ssh连接工具

    4. **转义字符**:在输入命令时,若需输入特殊字符(如分号、引号等),需在前面加上反斜杠(\)进行转义。 总之,Xshell 5.0.1339p 是一个强大且易用的SSH连接工具,对于IT专业人士来说,是管理和维护Linux服务器...

    为windows远程桌面加上SSL证书认证.pdf

    在Windows Server 2003中,微软公司提供了一个安全认证方式的远程桌面功能,即使用SSL加密信息来传输控制远程服务器的数据,以保障连接安全。该功能可以弥补了远程桌面功能本来的安全缺陷。 在这个功能中,我们可以...

    NetTool Version v2.0 IP配置工具

    2021.03.04 所有功能已完善,后期如果没有bug的话,2.0版本将最终版本 1、版本1.1 已加上DNS配置,示例数据优化,[修改配置]按钮改名为[编辑配置]。 2、版本1.5 支持配置多IP,多DNS。 启动速度优化 3、版本1.6 ...

    客户_服务器方式下VFP3.0与SQL Server的连接访问.pdf

    由于本身的数据库管理优势,加上功能强大的 SQL 接口,使得可以利用 VFP 作为前端工具,与服务器端的另一微软产品——SQL Server 数据库进行较好的连接访问。 在客户/服务器的数据库访问模式下,客户端需要使用前端...

    AR7240+AR9283 DD-WRT,UBNT编程器固件+简单硬改支持不死UBOOT教程

    1. 首先,根据hackpascal大神的建议,需要在89脚加上10K欧姆电阻连接3.3V电源。但作者发现只需在88脚加电阻也能成功,这是因为88脚在系统运行后被拉低,短接88和89脚会导致持续复位。 2. 实际操作中,作者建议在89...

    java socket实现双机通信 有界面

    服务器接收到消息后,需要广播给所有已连接的客户端,这可能涉及到对Socket集合的遍历和消息的转发。 在项目"Chat1.3"中,可能包含了以下文件结构: 1. Server类:实现服务器端的逻辑,包括监听端口、接受连接、...

    S7-1200PLC与组态王进行TCP通信的基本方法和步骤.docx

    在工业自动化领域,PLC(可编程逻辑控制器)与上位机软件的通信是实现远程监控和控制的关键。本文将详细介绍如何使用S7-1200 PLC与...在实际应用中,可以根据需要扩展更多变量和功能,实现更复杂的工业自动化系统。

    好友管理系统指导手册 实训2_添加数据.doc

    2. 在该方法前加上注释:// 该方法完成对新销售人员信息的添加功能 3. 定义 8 个字符型变量,用以保存新输入的销售员信息 4. 定义与数据库的连接、打开连接 5. 定义对向数据库添加数据的代码 6. 执行对向数据库添加...

Global site tag (gtag.js) - Google Analytics