记js触发事件的坑(js事件触发又失效)

版权声明:原创 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标签链接效果

猜你喜欢

转载自blog.csdn.net/rambler_designer/article/details/88936848
今日推荐