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


Posted in Javascript onMay 23, 2016

点击超链接调用 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图片的问题,以上方法均可。

Javascript 相关文章推荐
在 IE 中调用 javascript 打开 Excel 表
Dec 21 Javascript
基于jquery可配置循环左右滚动例子
Sep 09 Javascript
javascript制作loading动画效果 loading效果
Jan 14 Javascript
JavaScript使用循环和分割来替换和删除元素实例
Oct 13 Javascript
node.js中的http.createServer方法使用说明
Dec 14 Javascript
angular源码学习第一篇 setupModuleLoader方法
Oct 20 Javascript
JavaScript实现定时页面跳转功能示例
Feb 14 Javascript
微信小程序网络请求的封装与填坑之路
Apr 01 Javascript
使用Vue实现移动端左滑删除效果附源码
May 16 Javascript
详解小程序中h5页面onShow实现及跨页面通信方案
May 30 Javascript
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 jQuery
jQuery实现html可联动的百分比进度条
Mar 26 jQuery
以WordPress为例讲解jQuery美化页面Title的方法
May 23 #Javascript
jQuery中选择器的基础使用教程
May 23 #Javascript
基于BootStrap的图片轮播效果展示实例代码
May 23 #Javascript
AngularJS上拉加载问题解决方法
May 23 #Javascript
在IE8上JS实现combobox支持拼音检索功能
May 23 #Javascript
浅析JavaScript 箭头函数 generator Date JSON
May 23 #Javascript
用js实现放大镜的效果的简单实例
May 23 #Javascript
You might like
从C/C++迁移到PHP——判断字符类型的函数
2006/10/09 PHP
php 中英文语言转换类
2011/09/07 PHP
PHP使用imagick读取PDF生成png缩略图的两种方法
2014/03/20 PHP
PHP二维数组排序的3种方法和自定义函数分享
2014/04/09 PHP
PHP永久登录、记住我功能实现方法和安全做法
2015/04/27 PHP
PHP CURL中传递cookie的方法步骤
2019/05/09 PHP
js密码强度检测
2016/01/07 Javascript
AngularJS中如何使用$http对MongoLab数据表进行增删改查
2016/01/23 Javascript
easyui window refresh 刷新两次的解决方法(推荐)
2016/05/18 Javascript
JavaScript ES6的新特性使用新方法定义Class
2016/06/28 Javascript
实例解析jQuery中如何取消后续执行内容
2016/12/01 Javascript
js微信支付实现代码
2016/12/22 Javascript
微信小程序 图片加载(本地,网路)实例详解
2017/03/10 Javascript
JavaScript无缝滚动效果的实例代码
2017/03/27 Javascript
关于jQuery中fade(),show()起始位置的一点小发现
2017/04/25 jQuery
JavaScript实现求最大公共子串的方法
2018/02/03 Javascript
JavaScript设计模式之调停者模式实例详解
2018/02/03 Javascript
vue-devtools的安装步骤
2018/04/23 Javascript
JS解惑之Object中的key是有序的么
2019/05/06 Javascript
在layui框架中select下拉框监听更改事件的例子
2019/09/20 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
[02:39]DOTA2英雄基础教程 天怒法师
2013/11/29 DOTA
python实现将英文单词表示的数字转换成阿拉伯数字的方法
2015/07/02 Python
pthon贪吃蛇游戏详细代码
2019/01/27 Python
python实战串口助手_解决8串口多个发送的问题
2019/06/12 Python
python程序变成软件的实操方法
2019/06/24 Python
int在python中的含义以及用法
2019/06/27 Python
python中用ggplot绘制画图实例讲解
2021/01/26 Python
使用css3 属性如何丰富图片样式(圆角 阴影 渐变)
2012/11/22 HTML / CSS
美国新蛋IT数码商城:Newegg.com
2016/07/21 全球购物
android面试问题与答案
2016/12/27 面试题
类的返射机制中的包及核心类
2016/09/12 面试题
ktv中秋节活动方案
2014/01/30 职场文书
火烧圆明园的观后感
2015/06/03 职场文书
小马王观后感
2015/06/11 职场文书
2019如何书写演讲稿?
2019/07/01 职场文书