借助性能优化促进用户数增长(提高用户使用率)
2699
2022-08-09
a标签触发onclick事件而不跳转(a标签onclick不执行)
在web页面开发时,我们经常会遇到下列情况:
1.一个标签仅仅是要触发onclick行为;
2.表现上要有鼠标的pointer指针显示,或者其他类似a标签的视觉效果。
比如执行删除操作时,为了避免误操作,我们要弹出对话框让用户确定是否删除。因此我们经常会用链接形式代替
代码如下:
function del(){
if(confirm("确定删除该记录?")){
parent.window.location="执行删除.jsp";
return true;
}
return false;
}
这样做的后果是js代码会跳转到"执行删除.jsp"页面,而标签也会跳转打开一个空页面。因为html本身对 标签的href属性做了处理,所以就会先执行我们自己定义的方法,接着再运行它自身的方法(跳转的方法)。
解决方法主要有四种,如下:
1. 不用a标签,设定css或用js来表现(有点复杂);
2. 用a标签,onclick属性或onclick事件中返回false;(个人喜欢)
如:删除
这是个执行顺序的问题,这个标签的执行顺序应该是先执行onclick 的脚本,最后才进行href参数指定页面的跳转。在onclick中返回false,就可以中止标签的工作流程,也就是不让页面跳转到href参数指定的页面。
3. 用href="javascript:void(0)"这种伪协议;(这种伪协议,少写的好)
即:删除
4. 删除。(总是跳转到当前页面顶部,当页面内容较多时,还是会有跳转的感觉)
其他知识:
下面的代码创建了一个超级链接,用户单时会提交表单。 单此处提交表单
a标签中href ="#"中的#是锚点的意思 也可以认为是当前页面
下面是锚的使用方法:
效果是:点击锚就转到了锚点段落。
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
发表评论
暂时没有评论,来抢沙发吧~