最近看了好几个关于<a>标签和javascript:void(0)的帖子,谨记于此,以资查阅。
注:以下代码未经全面测试,但每一种方法可能会出现的情况都基本做了说明。
在做页面时,如果想做一个链接点击后不做任何事情,或者响应点击而完成其他事情,可以设置其属性 href = "#",但是,这样会有一个问题,就是当页面有滚动条时,点击后会返回到页面顶端,用户体验不好。
目前有如下几种解决办法:
1)点击链接后不做任何事情
1.<a href="javascript:void(0);" >test</a>
2.<a href="javascript:;" >test</a>
3.<a href="####" >test</a> //使用2个到4个#,见的大多是"####",也有使用"#all"等其他的
2)点击链接后,响应用户自定义的点击事件
1.<a href="javascript:void(0)" onclick="doSomething()">test</a>
2.<a href="#" onclick="doSomething();return false;">什么问题都解决了,包括浏览器不兼容问题</a> //或者直接使用href=""
3.<a href="#" onclick="alert();event.returnValue=false;">test</a>
说明:
1.javascript:void(0)这种伪协议,少写的好,如果你看过一些web标准的书就知道为什么了。(不懂,原话摘的,暂做记录)
2.链接(href)直接使用javascript:void(0)在IE中可能会引起一些问题,比如:造成gif动画停止播放等,所以,最安全的办法还是使用“####”。为防止点击链接后跳转到页首,onclick事件return false即可。
3.如果仅仅是想鼠标移过,变成手形,可以使用
<span style="cursor:pointer" onclick="foo()">Click Me!</span>
void是javascript的操作符,意思是:只执行表达式,但没有返回值,
void 操作符用法格式如下:
1. javascript:void (expression)
2. javascript:void expression
为了程序风格良好,建议使用第二种带上括号的
我们可以使用void操作符指定超级链接,如javascript:void(document.form.submit())。表达式会被计算但是不会在当前文档处装入任何内容,void(0)计算为0,但在JavaScript上没有任何效果,也就是说 <a href="javascript:void(0)">的效果同<a href="javascript:void(1)">的效果是一样的。
关键是只要知道void是javascipt自身的操作符,它表示的是只执行表达式,但没有返回值!
另外页面会自动调回顶端,是因为"#"默认的瞄点位置是top,所以会出现这种情况。
分享到:
相关推荐
* 脚本格式:<a href="javascript:void(0)"></a> * 锚链接:<a name=“标记名”></a> 和 <a href="#标记名"></a> * Target:_blank _top _self _parent 八、音乐和视频 * <embed src=””></embed>:可以加入多媒体...
在HTML中,`<a>`标签通常用于创建超链接,但也可以用来触发JavaScript函数。本文将详细探讨如何在`<a>`标签中调用JavaScript函数以及相关注意事项。 1. **JavaScript: 协议调用** 这种方法常见于老代码中,如`<a ...
而且,大多数人认为a标签最重要的作用是实现超链接,今天我刚好碰到a标签的一种写法<a></a>,所以就来整理下a标签中href的几种用法。 一、js的几种调用方法(参考总结的) 1、a href="[removed]js_method();" 这...
Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值。 void 操作符用法格式如下: 1. [removed]void (expression) 2. [removed]void expression ...1:<a></a> 2:<a></a> 3
<a href="javascript:void(0)" onclick="js_method();" rel="external nofollow">点击我</a> ``` 这是最常用的实现方式,`void(0)`返回`undefined`,阻止页面跳转。同时,它不会像方法1那样将JavaScript方法暴露在...
在网页设计和开发中,`<a>`标签(锚元素)是不可或缺的一部分,它用于创建超链接,将用户从一个页面导航到另一个页面。这里,我们来深入探讨一下`<a>`标签及其常用样式,以便在日常工作中快速引用。 1. **基本结构*...
在JavaScript中,`void`操作符是一个经常被忽视但其实非常实用的工具,尤其是在处理页面交互和DOM元素,特别是超链接(`<a>`标签)时。`void`的主要作用是计算一个表达式,但不返回任何值。这使得它在特定场景下具有...
<A HREF="javascript:void(0)">单击此处什么也不会发生</A> 在上面的例子中,void(0) 计算为 0,但是不会在当前文档处装入任何内容。因此,当用户点击链接时,什么也不会发生。 void 操作符也可以用于提交表单,...
在网页开发中,`<a>`标签用于创建超链接,它可以指向另一个页面或者执行JavaScript代码。然而,在某些情况下,我们可能需要阻止默认的链接跳转行为,比如在用户进行特定操作后才允许跳转,或者在点击链接时执行一些...
在HTML中,`<a>`标签通常用于创建超链接,可以指向其他网页或者执行特定的JavaScript函数。在现代Web开发中,使用JavaScript进行交互性增强是常见做法,因此在`<a>`标签中调用JavaScript函数是十分普遍的。本文将...
在HTML中,`<a>`标签通常用于创建超链接,而`a href="#"`和`a href="javascript:void(0)"`是两种常见的用法,它们之间有着显著的区别。 首先,`a href="#"`是一个指向页面内部锚点的链接。默认情况下,`#`代表页面...
代码如下: <a>GoNext</a> $(“a”).click(function(){ [removed].href = “xxx.html”; }) 代码如上,在IE下,特别是在IE6中,点击超链接之后,浏览器并没有发生跳转行为。 原因可能是因为在href中的[removed]void(0...
JavaScript中的`#`符号和`void`操作符在网页开发中有着不同的用途,尤其是在与超链接(`<a>`标签)交互时。首先,我们来分别理解这两个概念。 `#`符号通常用作URL的一部分,它代表锚点(anchor)。在HTML中,`#`...
HTML中的`<a>`标签主要用于创建超链接,可以引导用户访问指定的URL或者触发JavaScript事件。在`<a>`标签中,`href`和`onclick`是两个重要的属性,它们各自有不同的用途和交互方式。 `href`属性是`<a>`标签的核心...
- `<font>` 标签已过时,用来设置字体大小、颜色和类型,其中`size`属性可以取1到7的值,最大值为7。 4. `<pre>` 标签: - `<pre>` 标签用于定义预格式化的文本,保留空格和换行,常用于展示代码片段。 5. DHTML...
`<a>`标签有两个关键属性,即`href`和`onclick`,它们都可以用来控制页面的跳转行为,但具体使用方式和效果有所不同。 1. `href`属性:`href`属性是`<a>`标签的核心属性,用于定义链接的目标URL。当用户点击这个...
在HTML中,`<a>`标签通常用于创建超链接,它可以触发页面跳转或执行JavaScript函数。当需要在点击事件中传递当前元素的引用时,`onclick`属性和`href`属性都可以用来调用JavaScript函数,但它们处理`this`对象的方式...
10. 引用外部样式表:正确引用外部样式表的方法是使用`<link>`标签,例如`<link rel="stylesheet" type="text/css" href="mystyle.css">`。 11. JavaScript语法:A选项的括号内为空,会导致运行错误。其他选项创建...
2. **页面跳动**:如果`<a>`标签用于触发JavaScript操作,并且页面有滚动条,为了避免点击链接时页面滚动到顶部,可以设置`href="javascript:void(0)"`。这将阻止浏览器尝试跳转到任何位置,同时仍然允许执行`...
2. **行内元素与块级元素**:行内元素如`<a>`、`<span>`、`<img>`等,它们在同一行内显示,不自动换行。块级元素如`<div>`、`<ul>`、`<li>`等,它们各自占据一行,可以设置宽度和高度。 3. **空(void)元素**:没有...