版权声明:原创 https://blog.csdn.net/rambler_designer/article/details/88936848
问题:
之前用到了layer弹出层插件,在测试的时候,每次点击都先弹出,然后紧接着又消失,调试半天没找到问题
类似描述:js事件触发后,又恢复,或者又失效
代码分析
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>layer</title>
</head>
<body>
<a href=# id="show">弹出</a>
</body>
<script>
$("$show").click(function(){
});
</script>
</html>
【分析】
点击了按钮后,确实触发了js的事件,可以添加alert()中断执行查看,但是却又消失,这是为什么,百思不得其解,修改代码后,清理了浏览器缓存后,再次点击发现当前页面正在加载的效果,嗯??为什么会出现这个,跳转页面??于是仔细检查了一下,发现当初为了让a标签保留了href标签,href=#,于是点击按钮后,相当于刷新了当前页面,因此弹出层显示又消失
【解决方法】
- 去掉a标签的href属性,或者只填写属性名不写属性值
- href属性填写javascript:void(0),相当于a标签执行一个函数,不过直接返回了0,用这种方式取消a标签链接效果