JS点击超链接触发弹窗并阻止跳转的两种实现方式

作者:竹影

时间:2026-10-29

浏览:528

本文介绍如何在点击超链接时触发弹窗并阻止页面跳转。通过原生JS函数返回false或jQuery绑定click事件返回false,均可实现点击后打开对话框且不执行href链接跳转的效果。

文章目录

JS点击超链接触发弹窗并阻止跳转的两种实现方式

代码如下:

 
<script>
/*关于弹窗链接的问题
* 2014-04-24
*/1:超链接a onclick 弹窗后如何使超链接a失效
//js解决方案
function arts(sourceobj){
var url = $(sourceobj).attr("href");
art.dialog.open(url, {title: 'title',width: 400, height: 300});
return false;
} 
//jquery解决方案
$(document).ready(function(){
$('#aaa').click( function () {
var url = $(this).attr("href");
art.dialog.open(url, {title: 'title',width: 400, height: 300});
return false;
}); 
}); 
</script>

代码如下:

 
<a href="http://www.baidu.com" onclick="arts(this);return false" >触发弹窗</a>
<a href="http://www.baidu.com" id="aaa" >触发弹窗</a>
//2:ajax提交时避免将按钮置于submit上

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章