时光绘梦集
位置:首页JS正文

道法自然 2025/03/09 周7

js阻止跳转外部链接

js实现当点击外部链接时,弹出是否离开的提示。点击取消则阻止跳转。

document.addEventListener('click', e => {
    const i = e.target.closest('a');
    if (!i) return;
    const t = new URL(i.href, location.href),
        b = t.host !== location.host,
        c = t.protocol.startsWith('http');
    if (b && c) {
        if (!confirm(`即将跳转到外部地址:\n${t.host}\n确定继续吗?`)) {
            e.preventDefault()
        }
    }
})

实现方法:

1,检测是否是a标签,不是则退出。

2,把相对地址变更为绝对地址。

3,验证域名是否相同和是否是http开头的链接。

4,如果是http开头的域名又不同,弹出对话框,如果点击取消,拦截跳转。