href="#" 的坑

时间:2022-09-12 09:14:02

第一次发博客, 也不讲究样式。 只是单纯的说一下踩过的坑,方便后人避坑吧

之前做项目的时候,碰到一个非常奇葩的问题。 就是在jqgrid中写了了一个简单的方法

{name:'已经存在的列名称',
label:'操作',
formatter:function(cellvalue, options, row)
{
var rowId = "'"+row.id+"'";
return '<a href="#" onclick="lookImg('+rowId+')">查看流程图</a>'
+'&nbsp;&nbsp;<a href="#" onclick="lookDiagram('+rowId+')">查看diagram</a>';
}
}

很简单点击事件,但是每次点击的时候 都会产生一个很奇怪的问题。 就是页面会整体的向上平移。把我上部的tab栏给覆盖了

简单说一下我的页面布局

href="#" 的坑

格式采用的iframe设计

当我在下部标签栏的iframe页面中,点击的时候,会将上部标签栏和下部标签栏全部挤掉页面整体向上

后来解决方法:

  将href="#"替换为href="javascript:void()" 即可解决

再说一下  两者的区别

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

    2:javascript:void(0)  仅仅表示一个死链接

3: onclick事件会比 href属性先执行,所以会先触发 onclick 然后触发href

总结一下 :

1:单纯的想要跳转到一个新的页面 : 直接写href="页面地址"

   2:想要写一个脚本方法   最好 href="javascript:void(0)",避免样式发生奇怪的变化

3:想要实现位置的变化,比如tab标签 可以 href = "#"+id

至于具体的语法,可以参考楼下连接

参考于http://www.jb51.net/article/34156.htm

  

第一次写博客,希望读者可以多多支持,让我有勇气继续写一下,转载也请标注一下 谢谢

href="#" 的坑的更多相关文章

  1. selenium&plus;xpath获取href的坑

    先上HTML文档 <html> <body> <a href="http://www.example.com">Example</a&gt ...

  2. html中a标签href属性的一个坑

    由于公司需要,小菜最近在搞app web开发,目前只有ios和android版本,虽然仅此两个版本,但是依然要考虑浏览器兼容性问题,因为android和ios默认浏览器内核是不一样的. 先说说兼容性问 ...

  3. &lbrack;vue--开发记录&rsqb;使用location&period;href修改地址跳转页面在ie上遇到的坑

    管理后台项目上在用vue2.0开发,因为刚转vue2.0,不是太熟悉.在跳转页面的时候直接用location.href来修改地址跳转,在chrome和火狐上展现都是正常的.后面因为说要兼容到IE9,就 ...

  4. 曾经遇到的坑------href&equals;&quot&semi;&num;&quot&semi;和href&equals;&quot&semi;javascript&colon;void&lpar;0&rpar;&semi;&quot&semi;、href&equals;&quot&semi;javascript&colon;&semi;&quot&semi;

    这个是为了 在点击此链接后回到页首,如果你写href="#"那么点击后会回到页首,这样影响操作. <a href="javascript:void 0" ...

  5. 使用h5 &lt&semi;a&gt&semi;标签 href&equals;&&num;39&semi;url&&num;39&semi; download 下载踩过的坑

    用户点击下载多媒体文件(图片/视频等),最简单的方式: <a href='url' download="filename.ext">下载</a> 如果url ...

  6. selenium又一小坑 无法用XPATH直接获取属性值 需要使用&period;get&lowbar;attribute&lpar;&OpenCurlyDoubleQuote;href”&rpar;

    在使用selenium进行抓取url的时候,试图使用find_elements_by_xpath来获取. 因此想当然的直接使用XPATH的语法进行获取属性 事例缩略后xml结构如下 <div c ...

  7. vue项目中关于微信分享的坑,以及安卓和ios获取location&period;href不同的处理

    最近做vue项目的微信公众号项目,涉及到微信分享,记录一下心得,以备后用,vue路由用的是hash模式: 该项目只是公众号里面的h5链接,不需要获取code获取access_token的票据,因此前端 ...

  8. 关于window&period;location&period;href页面跳转的坑

    "window.location.href"."location.href"是本页面跳转 "parent.location.href"是上一 ...

  9. 踩坑系列《四》a标签的href属性拼接问题

    如上所示,无法直接在 html里面的 a 标签的href属性传递参数时,只需要在 JS 中获取对应 a 标签的id,再通过 attr 方法抓到 href,进行字符串拼接即可

随机推荐

  1. log4j向oracle中插入一条系统当前时间的sql语句

    配置log4j,要向oracle插入一条系统当前时间的sql语句,按网上查找的总是出现各种各样的报错,最后总结出的写法是: ### shezhi### log4j.rootLogger = debug ...

  2. ZOJ Problem Set - 3758 素数

    Singles' Day Time Limit: 2 Seconds Memory Limit: 65536 KB Singles' Day(or One's Day), an unofficial ...

  3. java图片处理开源框架

    java图片处理开源框架 以前一直不明白,java开源框架什么意思,搜集资料得出以下结论 其实java框架可以理解为一个工具或者一个插件,将一个公用的.常用的技术封装起来,处理一些基础的.繁琐的问题. ...

  4. Full-Stack-Fundation-Udacity------Lesson 1 Working with CRUD

    因为手头在做一个项目,我负责后台,就顺带快进学习Udacity上一个水课(?):Full Stack Foundation.上课的好像是个印度小哥(?),按1.5倍速听讲话还是有点逗的.废话不多说,进 ...

  5. sqlmap-学习1 配置环境

    sqlmap是一款非常强大的开源sql自动化注入工具,可以用来检测和利用sql注入漏洞.它由python语言开发而成,因此运行需要安装python环境 1 安装 python (https://www ...

  6. &lbrack;Python&rsqb; 文件扫描

    文件扫描 下载 https://github.com/YouXianMing/FileManager 细节 1. 基于Python 3.60,其他版本未测试 2. 支持扫描深度,不设置则扫描全部,设置 ...

  7. Hadoop生态集群之HDFS

    一.HDFS是什么 HDFS是hadoop集群中的一个分布式的我文件存储系统.他将多台集群组建成一个集群,进行海量数据的存储.为超大数据集的应用处理带来了很多便利. 和其他的分布式文件存储系统相比他有 ...

  8. 【大数据】Hive学习笔记

    第1章 Hive基本概念 1.1 什么是Hive Hive:由Facebook开源用于解决海量结构化日志的数据统计. Hive是基于Hadoop的一个数据仓库工具,可以将结构化的数据文件映射为一张表, ...

  9. mediawikide

    wiki.conf server { listen 80; server_name wiki.talkvip.cn; index index.html index.htm index.php; roo ...

  10. IP转换成域名

    DNS就是域名解析系统,它可以将IP转换成域名,也可以将域名转换成IP 1. 安装DNS服务 开始—〉设置—〉控制面板—〉添加/删除程序—〉添加/删除Windows组件—〉“网络服务”—〉选择“域名服 ...