JavaScript:长按复制或者点击微信号时,自动跳转到微信聊天界面

  在做竞价投流时,经常会遇到这样的需求:用户在浏览器中的落地页面复制或者点击微信号时,自动跳转到微信聊天界面。以缩短与目标客户的距离,提升ROI。
 
  实现这个需求,其实很简单。
 
  一、首先获取到需要监听含微信号的的span元素,使用document.querySelector()方法来获取。
 
  二、然后为span元素添加copy和click事件监听器,当用户在浏览器中复制或者点击span元素时,会触发相应的事件。
 
  三、在事件监听器中,将浏览器的window.location.href属性设置为微信的协议链接weixin://,这样就可以自动打开微信聊天界面了。
 
  需要注意的是,该功能只在用户的设备中已安装微信客户端时才有效。
 
  具体代码如下:
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>长按复制或者点击微信号时,自动跳转到微信聊天界面</title>
  </head>
  <body>
    <span class="wxcode">18610483107</span>
    <script>
    const span = document.querySelector('span'); // 获取span元素
    span.addEventListener('copy', () => {
    window.location.href = 'weixin://';
    });
    span.addEventListener('click', () => {
    window.location.href = 'weixin://';
    });
    </script>
  </body>
</html>