ios - ipad检测日期作为电话号码并插入电话链接

Question

我有以下响应式元素:

<table>
            <tr>
                <td>Besteldatum</td>
                <td itemprop="description">
                    24-2-2014
                </td>
            </tr>
            <tr>
                <td>Losse editie</td>
                <td itemprop="description">
                    2014-02
                </td>
            </tr>
</table>

奇怪的是，ipad 在第一个位置放置了一个链接，就好像它是电话一样，检查图像:

如果我在 ipad 中检查，我会看到 HTML 已转换为以下内容:

<table>
            <tbody><tr>
                <td>Besteldatum</td>
                <td itemprop="description">
                    <a href="tel:24-2-2014">24-2-2014</a>
                </td>
            </tr>
            <tr>
                <td>Losse editie</td>
                <td itemprop="description">
                    2014-02
                </td>
            </tr>
</table>

我认为 ipad 正在将此日期检测为电话号码并自动放置此链接。我有其他链接与 tel 链接，所以我想要一个不会取消其他 tel 链接的解决方案。

从来没有见过这个，有人可以帮忙吗？

Answer 1

这是 iOS 中的默认行为。这意味着用户只需单击网页上的电话号码即可调用电话。不幸的是，它有时会根据格式选择一些非电话号码。

您有几个选择。这里有一对。通过添加此元标记来禁用 iOS 电话号码检测:

<meta name="format-detection" content="telephone=no">

这可能是个坏主意，因为它会删除整个页面的电话号码检测，使真实电话号码不可点击。

或覆盖正在应用的样式，例如...

a[href^=tel] {
    color: #your_color;
    text-decoration: none;
    pointer-events: none;
}

如果您的页面上有一些真实的电话号码，您可能希望为非电话 parent 添加一个类以便区分:

    .date a[href^=tel] {
        color: #your_color;
        text-decoration: none;
        pointer-events: none;
    }