解决苹果iphone浏览器Safari把数字变色加下划线问题

已于 2022-12-31 18:10:13 修改
阅读量844 收藏
点赞数
分类专栏： 前端 bug解决方案 文章标签： safari iphone 前端
于 2022-05-01 17:39:34 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_23073811/article/details/124529648
版权

遇到的问题

  • 今天在修改一个php项目时，有一个需求时是把选中的数字相加
  • 在pc端浏览器试了没问题，在手机浏览器试了也可以，除了iphone手机（我没有苹果手机，穷得很，是用户反馈给我的）自带的Safari浏览器不能计算出相加结果，其他都可以

解决

我研究了下，是七位数以及以上的数字才会变色，数字100万为蓝色，100万到200万为绿色，200万为红色，且都被加了下划线，点击还会有个弹窗
在这里插入图片描述
这样就显然易见了，iPhone手机浏览器在加载网页的时候，会把疑是手机号或者电话号的一串数字加上一个连接，点了之后会弹出拨打号码的窗口，且它们无法变为数字进行计算
在文件head里面添加以下代码即可解决(我这里是php写的html文件）：

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

还想要识别手机号的功能可以这样，把a链接换成 tel:手机号

<a href="tel:13000000000">13000000000</a>

解决！！！！
又水了一篇文章，好开心

coderYYY
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
解决手机浏览器点击后退页面刷新问题，兼容苹果 safari浏览器和安卓浏览器
04-03
解决手机浏览器点击后退页面刷新问题，兼容苹果 safari浏览器和安卓浏览器。 js的window.onbeforeunload，onunload，window.addEventListener(‘pagehide‘, () =＞ {}手机浏览器不生效
苹果浏览器 Safari(苹果浏览器) v5.34.57.2
12-15
Safari(苹果浏览器)是Apple发布较快Windows平台浏览器，根据Apple所说，针对Windows平台的Safari浏览器，Apple Safari(苹果浏览器)是目前在windows平台上速度较快的浏览器，业界标准iBech测试显示，
ios浏览器里面数字被当做电话号码导致变色
walle的博客
03-05 4666
网页上有连续超过5个数字，ios浏览器就会当做手机号码，如果某行文字有颜色，那么这个连续的数字就没颜色，变黑色了。 解决方案：
去掉iPhone safari下手机号码默认的下划线
既是过河之卒，惟有奋力向前。
12-02 292
在开发iphone应用程序的时候，safari下手机号码默认是有下划线的，通过下面的方法就可以去掉： &lt;meta name="format-detection" content="telephone=no" /&gt;   &lt;meta name=”format-detection” content=”telephone=no” /&gt;   你明明写的一串数字没加链接样...
css----Safari苹果浏览器对于手机号的样式黑化处理
m0_37666587的博客
06-19 1081
问题：苹果自带浏览器打开页面，手机号会被变成黑色的文字，而不是预先设定的颜色（第一张图是设计稿样式，第二图是变色后的异常样式） 办法：增加<meta name="format-detection" content="telephone=no" />禁止识别手机号 <meta name="format-detection" content="telephone=no" /> 如果后期还想实现点击拨打电话没直接将手机号用a标签嵌套，使用tel功能即可，也可以解决这个变色.
safari打开的页面数字识别变为蓝色
gx_wqm的专栏
06-27 2107
今天网页碰到一个很怪异的问题：app打开的一个网页样式是好的，但通过safari打开后数字的蓝色变为蓝色，并且还变得可点击了！ 原来safari总会把长串数字识别为电话号码，文字变成蓝色，点击还会弹出菜单添加到通讯录。 解决方法： safari有个私有meta属性可以解决这个问题：
safari浏览器数字变蓝色的原因和处理
lokyaWeb的博客
04-10 1498
我就是突然发现到的 大家互相学习！
苹果iPhone safari浏览器样式重置修复submit按钮圆角bug
01-19
大家刚接触写手机页面 或许都会遇到的 修复iPhone的safari浏览器上submit按钮圆角bug 修改前： 修改后： 在CSS中加 复制代码代码如下: -webkit-appearance: none; 便可以解决。
iphone的safari浏览器中实现全屏浏览的方法
09-04
在iPhone的Safari浏览器中实现全屏浏览可以让用户在查看网页内容时获得更沉浸式的体验。通常，Safari浏览器在浏览网页时会显示顶部的工具栏和底部的标签页栏，这占据了屏幕的一部分空间。全屏浏览则可以隐藏这些元素...
Edge浏览器自动给数字加下划线的解决方法
itmyhome的专栏
06-10 1715
在Edge浏览器中会自动给符合某种规则的数字（比如电话号码、邮件等等）加下划线，如下图 解决方法是在head中加入： <meta name="format-detection" content="telephone=no,email=no,address=no">
打字有下划线怎么去掉mac_Mac 里最没存在感的便笺，其实是你没用对。
weixin_33016355的博客
01-11 1506
知乎视频​www.zhihu.com它可能是 Mac 上最没有存在感的应用——便笺。很多人偶尔看到或者想起来要用的时候，都会有一种 “鸡肋” 感，而且打字以外的任何操作似乎都要去到菜单栏。其实，是打开方式不太对，因为它最需要的是——快捷键。Command+N，新建一个便条，连续按下，新建无数个便条；Command+W，即可快速关闭当前便条。Command+M，快速折叠和打开便条，而 Command...
safari浏览器数字显示长度不一致的问题
u013018357的博客
02-27 2092
查了一下原因是safari的浏览器对数字0和1的渲染方式不一样导致的。0会比1宽，所以长度不一样，所以需要全部转换成全角数字，就可以了。 ![这里写图片描述](http://img.blog.csdn.net/20170227174221158?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMzAxODM1Nw==/font/5a6L5L2T/fo
解决H5页面在iOS网页中的数字被识别为电话号码，字体颜色变蓝色
sally18的博客
06-25 2317
Vue框架里面写法，写app.vue里面 <template> <div id="app"> <!-- 解决IOS手机自动识别为手机号颜色变蓝问题start --> <meta name="format-detection" content="telephone=no"> <!-- 解决IOS手机自动识别...
safari 浏览器 电话数字默认字体颜色显示黑色问题
dkmings的博客
06-28 2848
今天 在工作遇到一个问题 ， 在iphone  safari浏览器中  数字默认是黑色 。 但是按照要求应该全是白色 。  公司传真：0000-0000000 咨询热线：0000-000-000 公司邮箱：service@0000.com .footer p{ display:inline-block; text-align:center; color:#fff; wid
Edge浏览器自动给数字加下划线
ldc9001的专栏
03-13 5946
edge浏览器自动会给比较长的数字加上下划线效果，如图： 但很多时候这并不是我们想要的效果，去掉这个下划线，可以在head里面添加如下meta头
关于苹果浏览器将网页中的电话显示为灰色的处理办法
ly20180104的博客
08-15 918
将手机自动识别手机的功能关闭： <meta name="format-detection" content="telephone=no" /> 如果你还想要识别手机号的功能可以这样： <a href="tel:15*******60">15*******60</a> ...
小程序苹果手机底部出现横杠处理
weixin_46449470的博客
07-01 1630
iphone X 手机底部会出现横杠，会影响底部的操作，可以通过判断是否是对应机型，进行不同样式的设置 Taro.getSystemInfoSync() 获取系统信息同步接口。 官网说明：https://taro-docs.jd.com/taro/docs/apis/base/system/getSystemInfoSync 示例代码： try { const res = Taro.getSystemInfoSync() console.log(res.model) // 设备型号 cons
Dubbo 3.x源码(22)—Dubbo服务引用源码(5)服务引用bean的获取以及懒加载原理
最新发布
终生学习践行者
06-15 1303
基于Dubbo 3.1，详细介绍了Dubbo服务的发布与引用的源码，以及服务引用bean的获取以及懒加载原理
Linux程序解决苹果橘子问题
06-06
下面是一个简单的用C语言实现的橘子苹果问题的代码，使用Linux系统的进程同步机制解决竞争问题。代码中使用了互斥锁和条件变量来实现进程之间的同步。 ``` #include <stdio.h> #include <stdlib.h> #include <pthread.h> #define MAX 10 pthread_mutex_t mutex = PTHREAD_MUTEX_INITIALIZER; // 互斥锁 pthread_cond_t apple_ready = PTHREAD_COND_INITIALIZER; // 条件变量 pthread_cond_t orange_ready = PTHREAD_COND_INITIALIZER; // 条件变量 int basket = 0; // 篮子中的水果数 void *apple(void *arg) { int i; for (i = 0; i < MAX; i++) { pthread_mutex_lock(&mutex); while (basket != 0) { // 如果篮子不为空，就等待 pthread_cond_wait(&apple_ready, &mutex); } basket = 1; // 将一个苹果放入篮子 printf("Put an apple into the basket.\n"); pthread_mutex_unlock(&mutex); pthread_cond_signal(&orange_ready); // 唤醒等待的橘子进程 } pthread_exit(NULL); } void *orange(void *arg) { int i; for (i = 0; i < MAX; i++) { pthread_mutex_lock(&mutex); while (basket != 1) { // 如果篮子不为满，就等待 pthread_cond_wait(&orange_ready, &mutex); } basket = 0; // 将一个橘子放入篮子 printf("Put an orange into the basket.\n"); pthread_mutex_unlock(&mutex); pthread_cond_signal(&apple_ready); // 唤醒等待的苹果进程 } pthread_exit(NULL); } int main() { pthread_t tid1, tid2; pthread_create(&tid1, NULL, apple, NULL); pthread_create(&tid2, NULL, orange, NULL); pthread_join(tid1, NULL); pthread_join(tid2, NULL); return 0; } ``` 在这个代码中，我们使用了互斥锁来保证对篮子的访问是互斥的，确保每次只有一个进程可以访问篮子。同时，使用条件变量来实现进程之间的同步。苹果进程在篮子不为空的情况下等待，等待橘子进程将橘子放入篮子并唤醒自己；橘子进程在篮子不为满的情况下等待，等待苹果进程将苹果放入篮子并唤醒自己。 注意，在代码中使用`pthread_cond_wait()`和`pthread_cond_signal()`函数时，需要先获取互斥锁，以确保操作的原子性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

coderYYY

请简单粗暴地爱我，一元一元的赏

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值