<a>标签href属性与onclick事件
a标签主要用来实现页面跳转,可以通过href属性实现,也可以在onclick事件里实现。
<a onclick="window.location.href='www.cnblogs.com'" href="javascript:void(0);">博客园</a>
这段代码在主流浏览器里都没问题,但在IE6下会出现不能跳转的问题。这究竟是什么原因呢?
javascript:void(0);
void(arg);可以理解为永远返回null的函数,但是其参数不能为空。其参数可以为任意的表达式甚至函数。
<a href="javascript:void(name = '博客园'); alert(name);">测试</a>
IE6先运行DOM本身绑定的事件,如onclick;如果没有阻止冒泡,则会顺序执行href属性。而void(0);正是不需要执行任何事件,则IE6告诉浏览器不执行任何事件(覆盖之前的动作),并且终止冒泡相当于return false;于是浏览器没有执行任何动作。所以只要在onclick事件内阻止冒泡事件即可。
<a onclick="window.location.href='http://www.cnblogs.com';return false;" href="javascript:void(0);">博客园</a>
这样在IE6下就可以正常运行了。
另外还有一种方法就是不使用javascript:void(0);而改使用#也可以避免,href属性内的#本来的意思就是锚点#name所以当不指定任何锚点时会到页面顶端。#是有特定意义的,默认是#top,如果#后有内容会被认为是一个标签而从页面找到相应标签跳转到该处,找不到会跳转到页首,如果不想让跳转,可以使用###,###就是一个无意义的标签指定。
<a>标签href属性与onclick事件的更多相关文章
- js 重写a标签的href属性和onclick事件
适应场景:假如移动端拨打电话,需要给a标签添加href属性,但是由于需求,需要链接跳转的同时给a标签添加onclick事件,如果不做任何处理的话,默认执行点击事件,而不会跳转href属性的链接. 怎么 ...
- a标签href无值 onclick事件跳转
<a href='#' onclick='gomore()'>更多>></a> 单击无反应 <a href='javascript:void(0)' o ...
- jquery href属性和click事件冲突
a标签的定义如下: <a href="javascript:void(0);">test</a> jquery中的click事件: $("a&qu ...
- html中a标签href属性的一个坑
由于公司需要,小菜最近在搞app web开发,目前只有ios和android版本,虽然仅此两个版本,但是依然要考虑浏览器兼容性问题,因为android和ios默认浏览器内核是不一样的. 先说说兼容性问 ...
- HTML5的Video标签的属性,方法和事件汇总
<video>标签的属性 src :视频的属性 poster:视频封面,没有播放时显示的图片 preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览 ...
- A标签href属性详解--记录八
1.去掉<a>标签的下划线 <ul style=" list-style-type:none; margin:0;color:Gray; font-size:11px;ma ...
- a标签中href属性引起的页面不跳转问题
先简单描述问题,今天在做一个简单的提交页面的时候,碰到了跳转不了的问题.其中a标签的形式<a href="" onclick="submit()"> ...
- <a>标签缺少href 属性,鼠标经过不会出现手型
声明: web小白的笔记,欢迎大神指点.联系QQ:1522025433. 直接看实例吧! <!doctype html> <html> <head> <met ...
- WEB前端问题——img标签的onclick事件无法响应问题【转载】
一个纠结了一下午的问题,img标签里面的onclick事件无法响应.最终找到了错误原因,是因为img标签的id与onclick事件的方法名相同. 于是接着又测试了一下,发现name名和方法名相同也会导 ...
随机推荐
- Highcharts图形报表的简单使用
Highcharts是一个纯JavaScript框架,与MSChart完全不一样,可以在网页中使用,所以php.asp.net.jsp等等页面中都可以使用.Highcharts官网:http://ww ...
- [转]深入理解mysqldump原理 --single-transaction --lock-all-tables --master-data
本文转至:http://blog.csdn.net/cug_jiang126com/article/details/49824471 在mysqldump过程中,之前其实一直不是很理解为什么加了--s ...
- JavaScript-数据引用类型对象
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 百度上传工具webuploader,图片上传附加参数
项目中需要上传视频,图片等资源.最先做的是上传图片,开始在网上找了一款野鸡插件,可以实现图片上传预览(无需传到后台).但是最近这个插件出了莫名的问题,不易修复,一怒之下,还是决定找个大点的,靠谱的插件 ...
- linux-6的yum软件仓库
yum命令 命令 作用 yum repolist all 列出所有仓库 yum list all 列出仓库中的所有软件包 yum info 软件包名称 查看软件包信息 yum install ...
- 仿知乎Android端回答UI
个人觉得知乎这个回答界面非常的好看. 首先中间那个卡片,是cardview. 此外,要隐藏掉导航栏. 然后就是,怎么实现cardview怎么能有一半在蓝色部分呢? 首先要分成两部分,第一部分Textv ...
- orcale 匿名代码块
declare cursor readflow_cur is select * from od_readflow t where t.flowid is null; l_emp od_readflow ...
- 【Windows 10 IoT - 2】LED闪烁及动画绘制(树莓派 Pi2)
在上一篇博文<Windows 10 IoT系统安装>中,我们实现了在树莓派2平台上运行Window 10 IoT,本篇文章将介绍在该平台上的程序开发. 在最初获得的资讯中,以为Window ...
- Dynamic CRM 2013学习笔记(四十二)流程5 - 实时/同步工作流(Workflow)用法图解
实时工作流跟插件一样,也是用事件执行管道来执行,能在pre,post或核心操作中执行.跟插件一样,不能在创建之前和删除之后执行.如果执行过程中有异常发生,会取消并回滚整个操作.实时工作流里所有的活动和 ...
- fancybox,Ckeditor,jscrollpane 笔记串烧
有用到一些插件,整理了一些笔记,分享一下. 一.Fancybox 很酷很强大的弹窗插件 官网地址:Fancybox,基于jquery,开源协议是GPL和MIT. 主要的特点是:能展示图片,html元素 ...