a标签的javascript:void(0)

(一)

在写页面的时候,点击链接,有两种情况,一种是跳转到另一个页面,一种是只有点击链接效果而没有产生跳转到另一个页面的效果。当我们给a标签设置属性href="#"的时候,点击链接后会回到页面顶部,没有很好的用户体验

解决的办法有如下几种

点击链接后不出现任何效果

test test test //使用2个到4个#,见的大多是"####",也有使用"#all"等

点击链接后,响应用户自定义的点击事件

test 什么问题都解决了,包括浏览器不兼容问题 a> //或者直接使用href="" test

一些小建议

1.建议少写javascript:void(0);

2.链接(href)直接使用javascript:void(0)在IE中可能会引起一些问题,比如:造成gif动画停止播放等,所以,最安全的办法还是使用“####”。为防止点击链接后跳转到页首,onclick事件return false即可。

3.若只是显示鼠标移过,变成手形,可以使用样式Click Me!

注释:

1.在这里的void是javascript的操作符,表示只执行表达式,但没有返回值,而void的操作符用法格式是

javascript:void (expression)

javascript:void expression

在这里void是javascipt自身的操作符,它表示的是只执行表达式,但没有返回值!expression 是一个要计算的 Javascript 标准的表达式。

另外页面会自动调回顶端,是因为"#"默认的瞄点位置是top,所以会出现这种情况。

表达式会被计算但是不会在当前文档处装入任何内容,void(0)计算为0,但在JavaScript上没有任何效果,也就是说 的效果同的效果是一样的。也就是表达式会被计算,但在javascript中没有任何效果。

在这里举个例子

点击提交

区别

1.a href=#与 a href=javascript:void(0) 的区别

1)#包含了一个位置信息,默认的锚是#top ,也就是网页的上端

2)javascript:void(0) 只表示一个链接,调用脚本的时候用这个比较合适,又或者给标签添加一个点击事件,比如 ,

(二)

1.可采用的链接办法如下

1) window.open("url")

2)自定义函数

function openWin(tag,obj){

obj.target="_blank";

obj.href = "Web/Substation/Substation.aspx?stationno="+tag;

obj.click();

}

javascript:void(0);在浏览器上有兼容性问题,个人认为javascript:;比较适用

(三)总结

1.针对"#",出现调到顶部的情况

1:

2:

3:

4:

5:(好像在FF中不能显示)

2.要执行某些处理,但是不整体刷新页面的情况下,可以使用void(0),那什么情况下用void(0)比较多呢,无刷新,当然是Ajax了,看一下Ajax的web页面的话,一般都会看到有很多的void(0),所以在使用void(0)之前,最好先想一想,这个页面是否需要整体刷新。

a链接使用ajax 页面跳转,关于a标签的链接跳转相关推荐

  1. php如何让B链接在当前页面打,javascript - 如何实现点击链接 A 弹出窗口 X,点击链接 B 继续在弹出窗口 X (刷新)打开?...

    就是有很多链接,点击链接会弹出窗口,如何实现点击不同的链接,始终在同一弹出窗口中打开,而不是每次都弹出新的窗口. 用下面的代码只能每次都弹出新的窗口. $('a').click(function(){ ...

  2. 前端html——自动跳转、位置跳转、pre标签

    <meta http-equiv="refresh" content="5;url=http://107746.97dnso.com/tab_js911" ...

  3. 谷歌浏览器打开链接,如何不是覆盖当前页面而自动跳转到新标签页?

    Google Chrome打开链接直接会把当前页面覆盖掉,使用体验比较差. 看到很多人都是用插件解决的,但是我感觉谷歌不会把这么重要的功能隐藏为不可设置吧,所以找了好久,终于找到了方法. 第一步,打开 ...

  4. 微信URL Scheme码+长链接转短链接+短链接通过h5页面跳转到微信小程序

    微信URL Scheme码+长链接转短链接+短链接通过h5页面跳转到微信小程序 --生成微信URL Scheme码-->长链接转换成短链接-->通过短信进行推广-->用户访问营销短信 ...

  5. 网站域名在微信内显示已停止访问此页面解决方案,绿标防红链接生成,域名跳转链接生成

    网站域名在微信内显示已停止访问此页面解决方案,绿标防红链接生成,域名跳转链接生成 大家是否在刚大家好网站正准备推广没多久就出现了域名停止访问的问题,任何自己辛辛苦苦做的网站一次性就作废了很苦恼 下面告 ...

  6. 页面跳转微信及QQ的链接。QQ兼容安卓及苹果跳转

    项目中遇见的磕磕碰碰 页面跳转微信及QQ的链接.QQ兼容安卓及苹果跳转 QQ跳转,兼容安卓及苹果跳转的链接 页面跳转微信及QQ的链接.QQ兼容安卓及苹果跳转 QQ跳转,兼容安卓及苹果跳转的链接 此次遇 ...

  7. vue跳转到外部链接,vue页面的跳转

    Vue项目中跳转外部链接 google 就用a标签跳转 vue 页面跳转的两种方式 1,标签跳转 <router-link to='two.html'><button>点我到第 ...

  8. layui跳转html如何带参数,Layui跳转页面代码(可携带复杂参数)

    今天用了Layui的"数据表格 - 数据操作"示例代码,结果发现点击"编辑"按钮出出来一个弹出消息框,效果如下: 虽然说也可以用"弹出层"做 ...

  9. django模板-通过a标签生成链接并跳转

    views.py from django.shortcuts import render from django.http import HttpResponsedef index(request): ...

最新文章

  1. pytorch模型3.13
  2. 0x80070002错误一例
  3. mongodb 内存限制
  4. 微信小程序界面跳转(1)
  5. 【pmcaff】萝卜网高级会员奖品发放开始啦!快去领奖哟·!
  6. 动态调整线程池_调整线程池的重要性
  7. oracle 在所有表中查某个值,oracle需要查询某个字段的值在其他某个表中有没的值有相同...
  8. 2015C蓝桥杯C++A:格子中输出(详细讲解)
  9. python画图如何调整图例位置_Python——legend()图例位置调整
  10. shell 命令 --ps aux | grep
  11. 回溯算法高效解标准数独
  12. 显著性检验--学习笔记
  13. 专访李果:初生牛犊不怕虎的移动创业者
  14. BZOJ 1050 旅行comf
  15. 【基于WPF+OneNote+Oracle的中文图片识别系统阶段总结】之篇二:基于OneNote难点突破和批量识别...
  16. OpenCV/C++:点线面相关计算
  17. c#利用GUID生成随机码
  18. 初中数学503个必考知识点_初中数学|必考的21个知识点
  19. 网络安全工程师的初学路径
  20. 开源BI报表工具Metabase初体验

热门文章

  1. 圆形头像图标简单实现
  2. 信用卡里预借现金、已出账单、未出账单等的还款顺序
  3. DAMA数据管理知识体系指南-读书笔记16
  4. 第三天:让简历有点色彩-IFE
  5. TLD2314EL-ASEMI代理英飞凌汽车芯片TLD2314EL
  6. vba移动文件_利用NAME语句,给文件重命名
  7. Echarts实现股票前五盈亏数据图
  8. 【光剑极简教程系列】“计算机科学与技术”概述Computer Science and Technology
  9. C/C++面试常见问题(一)
  10. vue3使用富文本编辑器vueQuill