精华 免插件、DZ内置JS轻松实现外链访问二次确认对话提示框

[复制链接]
111 |5
发表于 4 天前 | 显示全部楼层 |阅读模式
原生JS轻松实现外链提示对话框,效果如图:


这是我基于Discuz!内置的showDialog对话框给外部链接加以点击后弹出访问二次确认对话框,以做安全提示及免责效用,这也是当下各大平台都有设置的基本功能。

代码如下:
  1.     // 外部链接安全提示    function jumpToExternalLink(link) {      const message = '您即将离开本站,请注意网络安全。即将访问:' + link + '';      showDialog(message, 'confirm', '即将访问外部链接', 'window.open(\'' + link + '\', \'_blank\')', 0, 2, '本域:admxn.com', '确定访问', '取消');    }        function forLinks() {    // 获取页面中所有的链接元素    const links = document.querySelectorAll('a, [data-href]');        // 遍历每个链接元素,并为其绑定点击事件    links.forEach((link) => {      const href = link.getAttribute('href') || link.getAttribute('data-href');          // 判断链接是否为外部链接      if (href && href.startsWith('http') && !href.includes(window.location.host)) {        link.addEventListener('click', (event) => {          event.preventDefault();          jumpToExternalLink(href);        });        link.setAttribute('target', '_blank'); // 在新窗口中打开链接      }    });    }    forLinks();
复制代码

将以上代码稍作修改后直接拷贝到如通用页脚模板文件footer.htm中即可。
DEMO:https://cn.admxn.com/

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

发表于 4 天前 | 显示全部楼层
感谢楼主{:4_104:}收藏备用{:4_111:}
回复

使用道具 举报

发表于 4 天前 | 显示全部楼层
来得及时,非常感谢楼主!{:4_108:}
回复

使用道具 举报

发表于 4 天前 | 显示全部楼层
测试了下,手机版好似无效
回复

使用道具 举报

发表于 4 天前 | 显示全部楼层
是的,是基于PC版内置的JS实现的
回复

使用道具 举报

发表于 4 天前 | 显示全部楼层
这个好,马住~
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表