A标签中 href 和 onclick用法、区别、优先级别
(内容摘自:https://blog.csdn.net/chenchunlin526/article/details/77346049)
Html A标签中 href 和 onclick 同时使用的问题 优先级别
1 顺序
ie 6 : href 先触发 onclick 后触发
其他浏览器 先触发onlick 后触发 href
2 href="javascript: xxx()"
不能传入this作为参数
onclick可以
| 代码如下 | 复制代码 |
| <a href="javascript:alert('href event');" onclick="clickevent(this);"> | |
3 优先触发的方法如果返回 false 导致后一个事件不被触发
比如
| 代码如下 | 复制代码 |
| <a href="javascript:alert('href event');" onclick="clickevent(this); return false;"> | |
4
<a href="#"> 会导致页面定位到书签位置,
5
由于 1和 4 的原因
在ie6 下 同时有 <a href="#" 和 onclick的时候 由于页面先因为href重新载入了一次,导致 onclick事件被浏览器丢弃。
6 总结:
1) 在不需要传递this作为方法的参数时候,推荐
只使用href="JavaScript: "
2) 如果需要使用this参数,推荐
| 代码如下 | 复制代码 |
| <a href="javascript:void(0);" onclick="doSomthing(this)" > | |
如下面一个列子。
我们需要A在第一次和第二次点击的时候 访问 href 第3次以后的就访问另一个地址
| 代码如下 | 复制代码 |
|
var href=0 function clicka(obj) <a href="http://www.111cn.net/" target=_blank id="showa" onclick="clicka(this)"> 开屏高速下载 </a> |
|
在a标签的href与onclick中使用javascript的区别
链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接);
假设链接中同时存在 href 与 onclick,如果想让 href 属性下的动作不执行,onclick 必须得到一个 false 的返回值。不信,你可以将 goGoogle 函数中的 return false 注释掉;
如果页面过长有滚动条,且希望通过链接的 onclick 事件执行操作。应将它的 href 属性设为 javascript:void(0);,而不要是 #,这可以防止不必要的页面跳动;
如果在链接的 href 属性中调用一个有返回值的函数,当前页面的内容将被此函数的返回值代替;
在按住Shift键的情况下会有所区别。
今天我遇到的问题,在IE6.0里以href的形式访问不到parentNode。
尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。
A标签中 href 和 onclick用法、区别、优先级别的更多相关文章
- Html A标签中 href 和 onclick用法、区别、优先级别
原文:Html A标签中 href 和 onclick用法.区别.优先级别 如果不设置 href属性在IE6下面会不响应hover.双击后会选中标签的父容器而非这个一a标签(IE下都存在这一问题). ...
- Html A标签中 href 和 onclick 同时使用的问题 优先级别
我们在制作网页的时候用得最多的就是 A 标签 超连接 但有时候需要在 A 里同时用到 href 和 onclick属性 下面我们先来分析一下 ,在不同的浏览器下有不同的效果 1 顺序 ie 6 : h ...
- a标签中href=""的几种用法(转)
a标签中href=""的几种用法 标签: html / a标签 / javascript 46371 众所周知,a标签的最重要功能是实现超链接和锚点.而且,大多数人认为a标签最 ...
- a标签中href属性引起的页面不跳转问题
先简单描述问题,今天在做一个简单的提交页面的时候,碰到了跳转不了的问题.其中a标签的形式<a href="" onclick="submit()"> ...
- <a>标签中href="javascript:;"** 为什么 style不用src**
&src/href <!--href 用于标示资源和文档关系,src 用于替换标签内容--> <img src="xxx.jpg"/> <sc ...
- 超链接a标签的href与onclick中使用javascript的区别
onclick中javascript的区别一般没用到都没注意,但出错时才有些郁闷,看文本章解释如下: 以前一直很随意,后来看.net里的linkbutton似乎是用在<a href=" ...
- a标签中href="javacript:;" href="javacript:void(0);" href="#"区别
在使用<a>标签时,经常会绑定其他事件比如onclick,这时候我们会给<a>标签的href属性赋值为“#”,“javacript:;”,“javacript:void(0); ...
- <a>标签的href和onclick属性
讨论 <a>标签中,href和onclick事件的顺序与冲突问题. 首先明确一点:链接的onclick 事件被先执行,其次是href属性下的动作(页面跳转,或 javascript 伪链接 ...
- 关于a标签的href属性值的区别
一.href="javacript:;" 这种用法不正确,这么用的话会出现浏览器访问“javascript:;”这个地址的现象: 二.href="javacript:v ...
随机推荐
- Gorm使用详解
1.什么是Gorm go语言编写的orm框架 特点: 1)全功能ORM 2)关联(包含一个,包含多个,属于,多对多) 3)Callbacks(创建/保存/更新/删除/查找前后回调) 4)预加载 5)事 ...
- Git Pro深入浅出(三)
七.自己定义Git 前面已经阐述了Git基本的运作机制和使用方式,介绍了很多Git提供的工具来帮助你简单且有效地使用它.本部分将演示怎样借助Git的一些重要的配置方法和钩子机制,来满足自己定义的需求. ...
- maven项目打包额外lib目录
maven项目依赖了几个额外的jar包一直都无法打进最终jar,不知道哪里出了问题.一直对这块不甚清楚,就大概梳理一下 默认打包方式: maven项目下,默认编译目录为 src/main/java和s ...
- IntelliJ IDEA(2018)安装和破解
IDEA 全称 IntelliJ IDEA,是Java语言开发的集成环境,IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手.代码自动提示.重构.J2EE支持.各类版本工具( ...
- springboot-async
在项目中,当访问其他人的接口较慢或者做耗时任务时,不想程序一直卡在耗时任务上,想程序能够并行执行, 我们可以使用多线程来并行的处理任务,也可以使用spring提供的异步处理方式@Async. Spri ...
- node常见操作命令
进入REPL环境(READ EVAL PRINT LOOP) 接收用户输入 执行用户输入 打印执行结果到控制台 循环到下一次 打开终端,键入node进入命令交互模式,可以输入一条代码语句后立即执 ...
- Laravel Homestead 离线安装
一.写在之前,网络不够快想要安装Homestead,也是一个浩大的工程,对于下载一个 1.22G左右的 laravel/homestead box 也是非常的麻烦.那么如何才能离线安装呢? 接着往下看 ...
- modified: xxx(modified content, untracked content)
当运行git status的时候提示如下: modified: xxx(modified content, untracked content) 我们会很本能的直接执行 add .commit .pu ...
- shell模板-跨目录执行,彩色输出,临时文件,行遍历文件
参数检查 #!/bin/bash set -e if [ ! -n "$1" ];then echo "Usage: #cmd <> []" exi ...
- Excel反序排列
实际工作中有这样一个需求,将Excel列表中所有的条目进行反序排列,有人说这还不简单直接选中某一列按照这列排序(升序或降序)就可以了. 但问题是这里没有可以参考的列,进行排序. 比如: 想转换为: 那 ...