超链接怎么正确调用javascript函数

点击超链接调用 JavaScript 函数,一般人都用:

复制代码 代码如下:

<a href="javascript:function();">

但这有个缺点,就是点击链接后,页面上的GIF动画将静止。

试看如下代码:

复制代码 代码如下:

<script type="text/javascript">
<!--
function Foo()
{
    //do something
}
//-->
</script>
<img src="logo.gif" alt="GIF 动画" />
<a href="javascript:Foo();">使 GIF 动画静止的链接</a>

解决方法探讨:

复制代码 代码如下:

<a onclick="javascript:Foo();">链接</a>

此时不影响动画显示,但鼠标移上去后,鼠标及超链接样式不发生变化,虽然可以利用样式表来改变鼠标及超链接样式,但毕竟有些繁琐,况且这种思路也不好。

再考查如下代码:

复制代码 代码如下:

<a onclick="javascript:Foo();" href="#">链接</a>

我们可以发现,虽然点击链接后不影响动画显示,但页面总是滚到最上面,这种效果也不是我们想要的。

最终解决方法:

复制代码 代码如下:

<a onclick="javascript:Foo();return false;" href="#">不影响 GIF 的链接</a>

如果不考虑GIF图片的问题,以上方法均可。

时间: 2016-05-22

JavaScript html5 canvas实现图片上画超链接

本文实例为大家分享了html5 canvas在图片上画超链接的具体代码,供大家参考,具体内容如下 1. html <canvas id="canvasFile" style="margin-top:15px;" width="500" height="400"></canvas> <input type="button" id="btnRedo" value

四种参数传递的形式——URL,超链接,js,form表单

什么时候用GET,  查,删 什么时候用POST,增,改  (特列:登陆用Post,因为不能让用户名和密码显示在URL上) 4种get传参方式 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>&l

javascript禁止超链接跳转的方法

本文实例讲述了javascript禁止超链接跳转的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> &l

JS实现网页上随机产生超链接地址的方法

本文实例讲述了JS实现网页上随机产生超链接地址的方法.分享给大家供大家参考,具体如下: 这是一个JavaScript的应用,每刷新一次页面,会自动更换一次链接,虽然不常用,不过对Javascript随机函数Math.random() 的使用将直到引导作用. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-math-rand-url-show-codes/ 具体代码如下: <html> <head> <title>在

让网页上的超链接失效,不能点击的js代码

让网页上的超链接失效,不能点击 a {poorfish:expression(this.onclick=function kill(){return false})} 我们 www.163.com www.sohu.com [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

js 取消超链接的方法小结

单个链接取消链接并触发js事件 复制代码 代码如下: <a href="javascript:void(0);" onclick="alert('ok')">测试</a> 批量将网页中的链接取消或重新设置链接的代码: 百度    我们 服务器软件    素材下载 站长查询    脚本下载 function doLinkAll(action){ var arr=document.getElementsByTagName("A"

js实现a标签超链接提交form表单的方法

本文实例讲述了js实现a标签超链接提交form表单的方法.分享给大家供大家参考.具体实现方法如下: <form action="/home/search" method="get" id="search_form"> <div class="searchBox png" id="searchBox"> <input type="text" id="

Ext javascript建立超链接,进行事件处理的实现方法

1,如何在javasript建立超链接 <script type="text/JavaScript"> //方法一: location.href='网址'; //方法二: document.write('<a href="网址">文字</a>'); </script> 2,应用到Ext中的树控件事件处理 tree_03.js 复制代码 代码如下: Ext.onReady(function(){ var root = n

BootStrap 超链接变按钮的实现方法

<a href="#"> xuhaitao </a> 上面代码效果如下: btn btn-default :变成一个按钮样子 btn-lg : 大号的按钮 btn-block : 按钮填充整个宽度 JS按钮(bootstrap)超链接 html代码: button是bootstrap样式,请先加入bootstrap.min.css和jquery-1.11.1.min.js <a href="#" id="DownLoadAud

javascript函数中执行c#函数的方法

1如何在JavaScript访问C#函数? 2.如何在JavaScript访问C#变量? 3.如何在C#中访问JavaScript的已有变量? 4.如何在C#中访问JavaScript函数? 问题1答案如下: javaScript函数中执行C#代码中的函数: 方法一:1.首先建立一个按钮,在后台将调用或处理的内容写入button_click中; 2.在前台写一个js函数,内容为document.getElementById("btn1").click(); 3.在前台或后台调用js函数

JS给超链接加确认对话框的方法

本文实例讲述了JS给超链接加确认对话框的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>JS给超链接加一个确认对话框</title> <script language="javascript"> <!--  function linkok(url){   question = confirm("你确认要链接到" + url +"

Javascript中this绑定的3种方法与比较

介绍 this 可以说是 javascript 中最耐人寻味的一个特性,学习this 的第一步就是明白 this 既不是指向函数自身也不指向函数的作用域. this 实际上是在函数被调用时发生的绑定,它指向什么地方完全取决于函数在哪里被调用. 为什么需要绑定this this代指当前的上下文环境,在不经意间容易改变: var info = "This is global info"; var obj = { info: 'This is local info', getInfo: ge

javascript实现单击和双击并存的方法

本文实例讲述了javascript实现单击和双击并存的方法.分享给大家供大家参考.具体分析如下: 在我们进行网页开发的过程中经常会遇到这么一个问题,为一个链接注册双击事件,或者让一个按钮或者其他元素上面同时注册单击或者双击事件,这时候我们发现网页中的双击事件似乎永远都不会起作用,原因是当我们点击一次的时候,就被超链接或者单击事件截获了,本文描述了一个如何解决这个技术问题的具体方法.本解决方案的实现原理是,单击事件和双击事件都调用同一个方法,我们根据两次鼠标点击的间隔时间来判断到底是单击还是双击事

JavaScript与C# Windows应用程序交互方法

一.建立网页 <html> <head>       <meta http-equiv="Content-Language" content="zh-cn">       <script language="javascript" type="text/javascript">              <!-- 提供给C#程序调用的方法 -->           

javascript动态创建及删除元素的方法

本文实例讲述了javascript动态创建及删除元素的方法.分享给大家供大家参考.具体分析如下: 在DOM中我们可以方便快速的动态删除与删除dom元素,这里我们就来给各位朋友简单的介绍一下. 例1: 动态创建一个按钮 复制代码 代码如下: <html> <head> <title>动态创建按钮</title> <script language="javascript"> var a,b,ab,ba,c; function cr

JavaScript定义及输出螺旋矩阵的方法详解

本文实例讲述了JavaScript定义及输出螺旋矩阵的方法.分享给大家供大家参考,具体如下: 昨晚无意看到这样一个算法题目,然后就想着用js来实现. 昨晚草草写完后感觉代码很丑,很臭,于是今晚又花点时间重构了一下,感觉变得优雅了. 什么是螺旋矩阵 螺旋矩阵是指一个呈螺旋状的矩阵,它的数字由第一行开始到右边不断变大,向下变大,向左变大,向上变大,如此循环. 如图: 实现效果 实现代码 (function() { var map = (function() { function map(n) { t