mailto链接唤起默认邮件应用后收件人地址不完整问题咨询

你给出的<a href="mailto:name.surname@mycompany.com">click here!</a>写法本身符合标准语法，出现域名丢失可按照以下步骤逐一排查修复：

• 排除页面<base>标签干扰：如果你的页面<head>中定义了<base>标签指定了默认根路径，部分浏览器会错误将mailto地址中@后的部分识别为相对路径进行拼接，可给mailto链接添加target="_top"属性规避这个问题：

  <a href="mailto:name.surname@mycompany.com" target="_top">click here!</a>
  

• 排除不可见字符干扰：如果邮箱地址是复制粘贴来的，可能带有零宽空格等肉眼不可见的特殊字符，手动逐字输入完整邮箱地址后重新测试。
• 排除前端框架配置干扰：如果在Vue、React、Next.js等前端框架环境下使用，检查项目配置中是否将@设置为了路径别名（比如把@映射到src目录），编译阶段会误把@mycompany.com识别为路径替换掉，可通过字符串拼接规避：

  <!-- Vue示例 -->
  <a :href="`mailto:name.surname${'@'}mycompany.com`">click here!</a>
  

• JS兜底方案：如果上述方案均无效，绑定点击事件手动触发mailto跳转：

  <a id="mailLink" href="#">click here!</a>
  <script>
    document.getElementById('mailLink').addEventListener('click', function(e) {
      e.preventDefault()
      window.location.href = 'mailto:name.surname@mycompany.com'
    })
  </script>
  

排查前可以先把标准mailto写法放在单独的空白HTML文件中测试，如果单独文件运行正常，说明是你的当前项目环境配置导致的问题；如果单独文件也出现异常，则是当前设备默认邮件客户端的兼容性问题，可更换客户端验证。

内容的提问来源于stack exchange，提问作者Paolo Quaggia