如何为将 Gmail 作为默认邮件处理程序的用户在新选项卡中打开 mailto 链接?

2024-02-23

在网页上,mailto 链接会打开默认的电子邮件客户端。现在 Chrome 提供了将 Gmail 设置为默认电子邮件客户端的功能,一些用户在同一窗口中打开了链接,从而使他们离开了单击链接的页面(他们不喜欢这样)

我尝试将目标_blank添加到链接中,这对gmail用户来说非常有用,但会让Outlook用户发疯,因为每次他们单击mailto链接时都会打开一个新的空白选项卡。

我有办法检测默认电子邮件处理程序并为两种类型的用户提供良好的体验吗?


好的,我可以在 Mac 上的 Chrome 中使用它了。你的旅费可能会改变。另外,在我看来,这是相当老套的,所以可能不值得。老实说,这应该作为 Chrome 中的设置存在,并且该行为应该委托给网站。例如。 Chrome 应该有一个选项:“[x] 始终在单独的选项卡中打开 mailto 链接”

话虽这么说,这就是你如何做到这一点。

首先像这样构建您的链接:

<a href="#" data-mailto="[email protected] /cdn-cgi/l/email-protection">Mail Somebody</a>

然后为它们设置一个点击处理程序。

$('a[data-mailto]').click(function(){
  var link = 'mailto.html#mailto:' + $(this).data('mailto');
  window.open(link, 'Mailer');
  return false;
});

有一个可选的options论证window.open你可以调整。事实上,我几乎会推荐它,看看是否能让生成的窗口尽可能不引人注目。https://developer.mozilla.org/en/DOM/window.open https://developer.mozilla.org/en/DOM/window.open

http://www.w3schools.com/jsref/met_win_open.asp http://www.w3schools.com/jsref/met_win_open.asp(MDN 文档很详尽,而 w3schools 文档几乎更容易阅读)

接下来我们需要创建 mailto.html 页面。现在您可能需要尝试一下下面看到的超时。您甚至可以将其设置为非常短的值,例如 500 毫秒。

<html>
<script>
function checkMailto(hash){
    hash = hash.split('mailto:');
    if(hash.length > 1){
        return hash[1];
    } else {
        return false;
    }
}

var mailto = checkMailto(location.hash);

if(mailto){
    location.href = 'mailto:'+mailto;
    setTimeout(function(){
      window.close();
    }, 1000);
}
</script>
</html>

Results

Mail.app 设置为我的默认电子邮件阅读器:

当我单击该链接时,它会立即打开一个窗口,然后撰写一条空白消息。在浏览器中,它会返回到原始页面。

在“设置”>“高级”>“隐私”>“处理程序”下将 Gmail 设置为邮件阅读器:

当我单击该链接时,它会打开 Gmail 的新选项卡,而上一页安全地位于其自己的选项卡中。

注意:将 Gmail 设置为电子邮件处理程序后,在操作系统端(至少在 Mac 上),Chrome 将被设置为系统的电子邮件处理程序。因此,即使您关闭 Gmail 作为 Chrome 中的电子邮件处理程序,它仍然是在操作系统级别设置的。因此,为了重置它,我转到“邮件”>“首选项”>“常规”。并将默认邮件阅读器设置回邮件。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何为将 Gmail 作为默认邮件处理程序的用户在新选项卡中打开 mailto 链接? 的相关文章

  • axios 请求中未发送正文数据

    我试图通过 axios 请求将数据发送到我的后端脚本 但正文看起来是空的 这是前端发送的请求 axios request method GET url http localhost 4444 next api headers Authori
  • Angular 4 过滤器搜索自定义管道

    所以我试图构建一个自定义管道来在 ngFor 循环中执行多个值的搜索过滤器 我花了几个小时寻找一个好的工作示例 其中大多数都是基于以前的版本 并且似乎不起作用 所以我正在构建管道并使用控制台为我提供值 但是 我似乎无法显示输入文本 以下是我
  • Angular UI select:从远程服务获取数据

    我正在使用角度用户界面选择 https github com angular ui ui select https github com angular ui ui select 我查看了演示的可用位置这个笨蛋 http plnkr co
  • JQuery datepickers-从开始日期设置结束日期

    使用了两个 Jquery 日期选择器 StartDate 和 EndDate
  • 如何让Gmail像加载进度条一样

    我想在页面的中心和顶部创建一个像 Gmail 一样的加载进度条 并适用于所有浏览器 这是基本代码
  • 在随机位置启动 HTML5

    我有一个大约 2 小时长的音轨 我想在我的网站上使用它 我希望它在页面加载时在随机位置开始播放曲目 使用 HTML5 可以吗 我知道您可以使用 element currentTime 函数来获取当前位置 但是如何在完全下载之前获取曲目的总时
  • 如何使 d3 饼图响应式?

    我有一个 PIE 图表 它工作正常 但我无法使其具有响应能力和可调整大小 我需要它与移动浏览器和 iPad 等兼容 div div
  • 在javascript中访问函数内的实例变量?

    如何以最简单的方式访问函数内的实例变量 function MyObject Instance variables this handler Methods this enableHandler function var button doc
  • 这种类型注释在没有 TypeScript 的 React 代码中如何工作?

    我在看这段代码示例 https reacttraining com react router web example auth workflow在 ReactRouter 页面上 这篇文章很有趣 const PrivateRoute com
  • 检测 Google 验证码的挑战窗口何时关闭

    我正在使用谷歌隐形验证码 有没有办法检测挑战窗口何时关闭 我所说的挑战窗口是指您必须选择一些图像进行验证的窗口 目前 我在按钮上放置了一个旋转器 一旦单击按钮 就会呈现验证码挑战 无法向用户提示另一个质询窗口 我以编程方式调用渲染函数 gr
  • karma/jasmine 控制台更详细的测试结果

    我使用 Karma 和 Jasmine 进行 javascript 单元测试 假设我有一个失败的测试 如下所示 expect objectA toEqual expectedObjectA 当失败时 我看到控制台上转储了两个对象 并显示一条
  • 如何将 Vue.js 作用域样式应用于通过视图路由器加载的组件?

    如何将 Vue js 作用域样式应用于通过以下方式加载的组件
  • 如何使用新的analytics.js跟踪多个帐户?

    我需要使用 Google 的新的analytics js 跟踪一个页面上两个帐户的综合浏览量 有大量教程和示例如何使用较旧的 ga js 进行操作 但我发现的只是这个分析文档页面 https developers google com an
  • Web组件中嵌套槽的内容不可见

    我有一个 Web 组件 它应该接受任意元素来包装其内容 虽然我可以在 Chrome 开发工具中看到插槽已正确分配 但 DOM 中什么也没有出现 以前有人见过这个问题吗 定义 class ExampleParent extends HTMLE
  • 如何在画布上所有其他内容后面绘制图像? [复制]

    这个问题在这里已经有答案了 我有一块画布 我想用drawImage在画布上当前内容后面绘制图像 由于画布上已经有内容 我正在使用字面上的画布来创建包含图像的画布 因此我无法真正先绘制图像 所以我无法使用drawImage在我呈现其余内容之前
  • Service Worker 与 Shared Worker

    Service Worker 和 Shared Worker 有什么区别 我什么时候应该使用 Service Worker 而不是 Shared Worker 反之亦然 Service Worker 具有共享 Worker 之外的附加功能
  • 摩纳哥:如何添加内联自动完成/代码建议?

    我找不到任何有关如何添加内联自动完成功能的示例 如下图所示 有人可以指导我如何在摩纳哥做到这一点吗 这可以在 v1 66 中启用 现在在 Insiders 中 The editor quickSuggestions设置现在接受内联为 配置值
  • ChartJs:如何按时间值(而不是像素)以编程方式平移

    我使用的是chartJs 3 6 1 和 Chartjs plugin zoom 1 2 1 但我认为这并不重要 我有 2 个时间序列折线图 当我通过拖放平移一个图表时 我也想移动 平移另一个图表 为此 我为 graphA 启用了缩放 平移
  • ThreeJS 中阴影的奇怪行为

    所以我有一个 ThreeJS 场景 并且添加了一些球体 多材质 我还添加了定向光 this light new THREE DirectionalLight 0xFFFFFF 1 this light position set 2 10 2
  • ng-include 和 ng-view 不同时加载

    下面是我的应用程序的结构 很简单 页眉和页脚是非常小的文件 而主页上的 ng view 要大得多 当我进入该页面时 我注意到了这一点 首先加载两个 ng include 然后 ng view 出现 页脚被推到底部 页脚闪烁大约 0 1 秒

随机推荐