Chrome下点击按钮多次调用window.open(mailto)仅生效一次的解决办法咨询

这个问题我太熟悉了——Chrome的安全机制为了遏制恶意弹窗，在**单次用户触发的事件（比如按钮点击）**里只会允许一次window.open()调用生效，后续的都会被默默拦截，这就是你只看到第一个邮件客户端打开的原因。不过有几个靠谱的workaround可以解决这个问题，我给你分享两个最实用的：

方法一：使用window.location.href配合延迟触发 #

既然window.open()受限制，我们可以直接修改window.location.href来触发mailto链接，Chrome对这种方式的限制要宽松很多。为了避免快速触发导致的冲突，给每个请求加个小延迟就好：

function openMail(){ 
  let selected = $("#table").bootstrapTable("getSelections"); 
  // 遍历选中项，给每个请求加递增延迟
  selected.forEach((row, index) => {
    setTimeout(() => {
      // 记得对参数做URL编码，避免特殊字符破坏链接
      const mailtoUrl = `mailto:${encodeURIComponent(row.email)}?subject=${encodeURIComponent(row.bsubject)}&body=${encodeURIComponent(row.body)}`;
      window.location.href = mailtoUrl;
    }, index * 100); // 每100ms触发一个，可根据需求调整
  });
}

方法二：创建隐藏标签模拟点击 #

另一种更稳妥的方式是动态创建隐藏的<a>元素，然后模拟用户点击它。因为每个<a>的点击属于用户触发事件链内的操作，Chrome不会拦截这种多次触发：

function openMail(){ 
  let selected = $("#table").bootstrapTable("getSelections"); 
  selected.forEach(row => {
    // 编码参数，确保链接有效性
    const mailtoUrl = `mailto:${encodeURIComponent(row.email)}?subject=${encodeURIComponent(row.bsubject)}&body=${encodeURIComponent(row.body)}`;
    // 创建隐藏的a标签
    const link = document.createElement('a');
    link.href = mailtoUrl;
    link.target = '_blank'; // 用_blank避免影响当前页面
    link.style.display = 'none';
    document.body.appendChild(link);
    // 模拟点击
    link.click();
    // 用完移除元素
    document.body.removeChild(link);
  });
}

额外提醒：务必对参数做URL编码 #

你原来的代码里没有对subject和body做编码，如果内容里有空格、&、中文这类特殊字符，会直接破坏mailto链接的结构，导致参数丢失或者跳转失败。上面两个方法里都加了encodeURIComponent()来处理这个问题，一定要记住加上哦！

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