关于ios手机safari浏览器的bug

问题:

我在一个<em>181xxxx234</em>这是一个电话标签, 我在js代码中使用

javascript 复制代码
document.getElementById('callButton').addEventListener('click', function() {
    // 替换下面的电话号码为你想拨打的电话号码
    window.location.href = 'tel:+1234567890';
});

实现了点击这个标签调出手机的电话功能, 目前所有设备都是正常的.

我在这个元素中设置了css属性是蓝色的, 也就是这181xxxx234电话号码是蓝色的, 用户一看就是可以点击的, 我是给em加上了蓝色的color, 所有设备都是正常的, 只有ios的safari设备是不正常的, 蓝色没有显示, 显示的是黑色, 使用了所有的方法都加不上去这个蓝色,

当不知为什么的时候, 同时使用一根线 ,连接了手机和电脑, 使用电脑的safari进行调试, 调试后发现safari自动给你加上了一个a标签, 原因是safari浏览器看见你是一个tel的元素, 他就给你自动加上a标签, 导致em上的蓝色无法作用到内部新增的a标签中, 所以:

在safari中的形式:

<em>

<a>181xxxx234</a>

</em>

多了一层a标签导致的, 我们多谢一段css:

em a{

color: #xxxx;

}

这样我们的元素就生效了, 成为蓝色了.

相关推荐
2401_8658548816 小时前
iOS应用想要下载到手机上只能苹果签名吗?
后端·ios·iphone
AORO_BEIDOU21 小时前
迈入国际舞台,AORO M8防爆手机获国际IECEx、欧盟ATEX防爆认证
5g·安全·智能手机·信息与通信
ueotek1 天前
Ansys Zemax | 手机镜头设计 - 第 4 部分:用LS-DYNA进行冲击性能分析
智能手机·ansys·zemax·光学
HackerTom1 天前
iOS用rime且导入自制输入方案
ios·iphone·rime
良技漫谈1 天前
Rust移动开发:Rust在iOS端集成使用介绍
后端·程序人生·ios·rust·objective-c·swift
2401_852403551 天前
高效管理iPhone存储:苹果手机怎么删除相似照片
ios·智能手机·iphone
西瓜本瓜@1 天前
在Android开发中如何使用OCR获取当前屏幕中的文本?
android·java·开发语言·智能手机·ocr
hgdlip1 天前
手机的ip地址是固定的吗?多角度深入探讨
网络·tcp/ip·智能手机
AORO_BEIDOU1 天前
热成像手机VS传统热成像仪:AORO A23为何更胜一筹?
人工智能·5g·安全·智能手机·信息与通信
星际码仔2 天前
【动画图解】是怎样的方法,能被称作是 Flutter Widget 系统的核心?
android·flutter·ios