Html 使用 jQTouch 时，我无法从 Mobile Safari 获取 mailto 链接以打开邮件应用程序。可能有什么问题？

I can't get mailto links to open the Mail app from Mobile Safari when using jQTouch. What could be wrong?

提问by Mark Bell

I'm developing an iPhone web app using jQTouch, and it contains a simple mailto:link to a valid email address, which should launch the iPhone mail application when tapped—but it doesn't.

我正在使用jQTouch开发一个 iPhone 网络应用程序，它包含一个mailto:指向有效电子邮件地址的简单链接，点击后应该会启动 iPhone 邮件应用程序，但它没有。

If I visit a "normal" web page in Mobile Safari which contains the exact same link, and tap on it, I get the expected result: the mail app pops up with the correct email address in the To field.

如果我在 Mobile Safari 中访问包含完全相同链接的“普通”网页，然后点击它，我会得到预期的结果：邮件应用程序会在“收件人”字段中弹出正确的电子邮件地址。

Here's the link HTML (with the address changed) just in case I'm going nuts and have made a stupid mistake, but it appears perfectly fine:

这是 HTML 链接（地址已更改），以防万一我发疯并犯了一个愚蠢的错误，但它看起来完全没问题：

<p><a href="mailto:[email protected]">[email protected]</a></p>

Has anyone come across this when using jQTouch? Or can anyone at least suggest a way that I can debug this? At the moment when I tap the non-working link it flashes red (the active link state) and absolutely nothing else happens.

有没有人在使用 jQTouch 时遇到过这个问题？或者任何人都可以至少提出一种我可以调试的方法吗？当我点击非工作链接时，它会闪烁红色（活动链接状态），并且绝对没有其他任何事情发生。

采纳答案by Mark Bell

I looked again at the example code in the jQTouch demo package and saw that they were adding a target="_blank"attribute to their email link.

我再次查看了 jQTouch 演示包中的示例代码，发现他们正在向target="_blank"电子邮件链接添加一个属性。

I did this to my link, and it began working (popping up the mail client window). However, the link that's in a standard web page works as well, but withoutthe target="_blank"attribute...

我对我的链接做了这个，它开始工作（弹出邮件客户端窗口）。然而，这是一个标准的Web页面的链接的作品为好，但没有的target="_blank"属性...

I'm puzzled, but adding that attribute seems to solve this problem if your mobile page is using jQTouch.

我很困惑，但是如果您的移动页面使用 jQTouch，添加该属性似乎可以解决这个问题。

回答by Travis

I found that adding target="_blank"to the links worked -- except that on some desktop browsers, it opened a new blank window AND opened the email window. Granted, jqtouch sites aren't typically going to be viewed on desktop browsers, but I wasn't fond of that behavior.

我发现添加target="_blank"链接有效——除了在某些桌面浏览器上，它打开了一个新的空白窗口并打开了电子邮件窗口。诚然，jqtouch 站点通常不会在桌面浏览器上查看，但我不喜欢这种行为。

Instead, here's what I did:

相反，这是我所做的：

• Put the mailto:link in the onclickevent and added return false(so actual link to #doesn't fire)
• Added a noHighlightclass to the link

• 将mailto:链接放在onclick事件中并添加返回false（因此#不会触发实际链接）
• noHighlight在链接中添加了一个类

Here is an example:

下面是一个例子：

<a href="#" onclick="window.location='mailto:[email protected]'; return false;" class="noHighlight">Email me</a>

I then modified the CSS in the theme file.

然后我修改了主题文件中的 CSS。

Before:

前：

ul li a.active {
   background: #194fdb url(img/selection.png) 0 0 repeat-x;
   color: #fff;
}

After:

后：

ul li a.active:not(.noHighlight) {
   background: #194fdb url(img/selection.png) 0 0 repeat-x;
   color: #fff;
}

The reason I added the noHighlightclass is that without it, the button would get highlighted and would "stick" which made the button look like it was still in some active state. To get around the issue, I added the class and modified the CSS as described above.

我添加noHighlight类的原因是没有它，按钮会突出显示并“粘住”，这使得按钮看起来仍然处于某种活动状态。为了解决这个问题，我添加了这个类并修改了如上所述的 CSS。

What the CSS change does is that if the link (inside of a liwhich is inside of a ul) has the class noHighlight, it will NOT change the background or text color.

CSS 更改所做的是，如果链接（在 ali内的 a 内ul）具有 class noHighlight，则不会更改背景或文本颜色。

Seems to work great now on both desktop and mobile browsers.

现在似乎在桌面和移动浏览器上都运行良好。

回答by deltas4

It works fine just with target="_blank".

它仅与 target="_blank" 一起工作正常。

For those (like me) who find it annoying to get the "This will open in a new page" popup every time you tap on a mailtoor tellink you can do this:

对于那些（像我一样）觉得每次点击mailto或tel链接时都会弹出“这将在新页面中打开”弹出窗口很烦人的人，您可以这样做：

Edit jqtouch.js and go to line 284:

编辑 jqtouch.js 并转到第 284 行：

if ($el.attr('target') == '_blank' || $el.attr('rel') == 'external')

Now replace this line by:

现在将这一行替换为：

if ($el.attr('target') == '_self' || $el.attr('target') == '_blank' || $el.attr('rel') == 'external')

And on the HTML (e.g.):

在 HTML 上（例如）：

<a href="tel:[phone]">Call me</a>

becomes

变成

<a target="_self" href="tel:[phone]">Call me</a>

回答by RyJ

This isn't related to jQTouch, but mailto: links weren't working for me either and to fix them, all I had to do was add slashes after the colon.

这与 jQTouch 无关，但 mailto: 链接对我也不起作用，要修复它们，我所要做的就是在冒号后添加斜杠。

mailto://[email protected]

mailto://[email protected]

Got the idea to do this here: http://mobiledevelopertips.com/cocoa/launching-other-apps-within-an-iphone-application.html. Strangely enough, telephone links worked fine for me without the slashes.

有想法在这里做：http: //mobiledevelopertips.com/cocoa/launching-other-apps-within-an-iphone-application.html。奇怪的是，没有斜线的电话链接对我来说很好用。

回答by para

Excellent find, I'm doing the same thing and couldn't understand why until recently. If you look round line 161 and 284 in jqtouch.js rev 109 you see that the target attribute "_Blank" will keep jqtouch from hiHymaning your click event. It is intercepting the event because that is the primary mechanism to move from page to page.

很棒的发现，我也在做同样的事情，直到最近才明白为什么。如果您查看 jqtouch.js rev 109 中的第 161 和 284 行，您会看到目标属性“_Blank”将阻止 jqtouch 劫持您的点击事件。它正在拦截事件，因为这是从页面移动到页面的主要机制。