当前位置： 文江博客话题详情

我的 HTML 是否会阻止 UIWebView 检测电话号码？

发布于 2024-11-04 05:33:15 字数 6918 浏览 0 评论 0原文

我有一个 UIWebView，我希望在其中检测电话号码。

我的问题是，在单个 UIWebView 中，某些电话号码可以被检测到并可点击，但其他电话号码则不能，我不知道为什么。

这是我的 HTML 片段：

0123456789 9999999999 
<div>1111111111</div>
<div>
  <ul>
    <li>
      <div>
        <h4>Name</h4>
        <p>Name</p>
      </div>
    </li>
    <li>
      <div>
        <h4>Telephone</h4>
        <p>0466303737</p>
      </div>
    </li>
  </ul>
</div>

检测到前 2 行中的前 3 个数字，但

内的数字被检测到。元素（第 14 行）不是。

有人知道为什么吗？有什么办法吗？

编辑：根据评论中的要求，这里是完整的 HTML：

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css">/*  HTML5 ✰ Boilerplate  */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,  footer, header, hgroup, 
menu, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display:block;
}
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }


body { font:13px/1.231 sans-serif; *font-size:small; } 
select, input, textarea, button { font:99% sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }

body, select, input, textarea {   color: #444; }
h1,h2,h3,h4,h5,h6 { font-weight: bold; }
html { overflow-y: scroll; }

a:hover, a:active { outline: none; }
a, a:active, a:visited { color: #607890; }
a:hover { color: #036; }

ul, ol { margin-left: 1.8em; }
ol { list-style-type: decimal; }

nav ul, nav li { margin: 0; } 
small { font-size: 85%; }
strong, th { font-weight: bold; }
td, td img { vertical-align: top; } 
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
pre {  padding: 15px;  white-space: pre;  white-space: pre-wrap;  white-space: pre-line;  word-wrap: break-word; }
textarea { overflow: auto; } 
.ie6 legend, .ie7 legend { margin-left: -7px; } 
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { border-radius: 1px;  -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red;  box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, 
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; } 
a:link { -webkit-tap-highlight-color: #FF5E99; } 

button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; } 
.visuallyhidden { position: absolute !important; clip: rect(1px 1px 1px 1px);  clip: rect(1px, 1px, 1px, 1px); }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after {  content: "\0020"; display: block; height: 0; visibility: hidden;    } 
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


 /* Primary Styles
    Author: 
 */














@media all and (orientation:portrait) { 

}

@media all and (orientation:landscape) { 

}

@media screen and (max-device-width: 480px) {


  /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}

@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none !important; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }  
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}

/*** CUSTOM CSS **/

body {
  font-family: "Helvetica", sans-serif;
  background-color: #767676;
  color: #d4d4d4;
  font-size: 11pt;
  padding: 10px;
}

p {
  padding: 6px 0px;
}

h1 {
  text-align: center;
  font-style: italic;
  font-size: 14pt;
  margin-bottom: 10px;
}

h3 { width: 100%; clear: both;}

ul {
  margin-left: 32px;
  list-style-image: url(favourite-star-on.png);
}

.tableau ul { margin-left: 0px;   font-size: 9pt; }
.tableau li { display: block; padding: 3px 0; border-top: 1px dotted #e4e4e4; }
li h4 { float: left; width: 112px; padding: 6px 3px; }
li p { float: right; width: 172px; padding: 6px 3px; }
div:before, div:after {  content: "\0020"; display: block; height: 0; visibility: hidden;    } 
div:after { clear: both; }
div { zoom: 1; }

.tableau { background-color: #fefefe; border: 1px solid #e4e4e4; color: #3e3e3e; }
.tableau h2 { background-color: #f3f3f3; width: 288px; padding: 5px; border-bottom: 1px solid #e4e4e4; }
.tableau h3 { background-color: #f3f3f3; font-style: italic; width: 288px; padding: 5px; border-bottom: 1px dotted #e4e4e4; }
</style></head><body>0123456789 9999999999  <div class="myclass">1111111111</div> <div class="myclass">   <ul>    <li>      <div>        <h4>Name</h4>         <p>Name</p>       </div>     </li>     <li>       <div>         <h4>Téléphone</h4>         <p>0466303737</p>       </div>     </li>   </ul> </div></body></html>

ps：我住在法国，即电话号码=> 10位数字

原文

I have a UIWebView in which I want phone numbers to be detected.

My problem is that in a single UIWebView, some phone numbers are detected and clickable but others are not and I have no idea why.

Here is a snippet of my HTML :

0123456789 9999999999 
<div>1111111111</div>
<div>
  <ul>
    <li>
      <div>
        <h4>Name</h4>
        <p>Name</p>
      </div>
    </li>
    <li>
      <div>
        <h4>Telephone</h4>
        <p>0466303737</p>
      </div>
    </li>
  </ul>
</div>

The 3 first numbers on the 2 first lines are detected but the one inside the <p> element (line 14) is not.

Does anybody know why? Is there anything to do about it?

EDIT : as requested in the comments, here is the full HTML:

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css">/*  HTML5 ✰ Boilerplate  */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,  footer, header, hgroup, 
menu, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display:block;
}
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }


body { font:13px/1.231 sans-serif; *font-size:small; } 
select, input, textarea, button { font:99% sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }

body, select, input, textarea {   color: #444; }
h1,h2,h3,h4,h5,h6 { font-weight: bold; }
html { overflow-y: scroll; }

a:hover, a:active { outline: none; }
a, a:active, a:visited { color: #607890; }
a:hover { color: #036; }

ul, ol { margin-left: 1.8em; }
ol { list-style-type: decimal; }

nav ul, nav li { margin: 0; } 
small { font-size: 85%; }
strong, th { font-weight: bold; }
td, td img { vertical-align: top; } 
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
pre {  padding: 15px;  white-space: pre;  white-space: pre-wrap;  white-space: pre-line;  word-wrap: break-word; }
textarea { overflow: auto; } 
.ie6 legend, .ie7 legend { margin-left: -7px; } 
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { border-radius: 1px;  -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red;  box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, 
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; } 
a:link { -webkit-tap-highlight-color: #FF5E99; } 

button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; } 
.visuallyhidden { position: absolute !important; clip: rect(1px 1px 1px 1px);  clip: rect(1px, 1px, 1px, 1px); }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after {  content: "\0020"; display: block; height: 0; visibility: hidden;    } 
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


 /* Primary Styles
    Author: 
 */














@media all and (orientation:portrait) { 

}

@media all and (orientation:landscape) { 

}

@media screen and (max-device-width: 480px) {


  /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}

@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none !important; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }  
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}

/*** CUSTOM CSS **/

body {
  font-family: "Helvetica", sans-serif;
  background-color: #767676;
  color: #d4d4d4;
  font-size: 11pt;
  padding: 10px;
}

p {
  padding: 6px 0px;
}

h1 {
  text-align: center;
  font-style: italic;
  font-size: 14pt;
  margin-bottom: 10px;
}

h3 { width: 100%; clear: both;}

ul {
  margin-left: 32px;
  list-style-image: url(favourite-star-on.png);
}

.tableau ul { margin-left: 0px;   font-size: 9pt; }
.tableau li { display: block; padding: 3px 0; border-top: 1px dotted #e4e4e4; }
li h4 { float: left; width: 112px; padding: 6px 3px; }
li p { float: right; width: 172px; padding: 6px 3px; }
div:before, div:after {  content: "\0020"; display: block; height: 0; visibility: hidden;    } 
div:after { clear: both; }
div { zoom: 1; }

.tableau { background-color: #fefefe; border: 1px solid #e4e4e4; color: #3e3e3e; }
.tableau h2 { background-color: #f3f3f3; width: 288px; padding: 5px; border-bottom: 1px solid #e4e4e4; }
.tableau h3 { background-color: #f3f3f3; font-style: italic; width: 288px; padding: 5px; border-bottom: 1px dotted #e4e4e4; }
</style></head><body>0123456789 9999999999  <div class="myclass">1111111111</div> <div class="myclass">   <ul>    <li>      <div>        <h4>Name</h4>         <p>Name</p>       </div>     </li>     <li>       <div>         <h4>Téléphone</h4>         <p>0466303737</p>       </div>     </li>   </ul> </div></body></html>

ps : I live in France ie phone number => 10 digits

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论， 你可以免费 注册 一个本站的账号。

评论（1）

塔塔猫 2024-11-11 05:33:15

电话号码解析很神奇，恐怕只有苹果魔术师才有能力告诉你他们是怎么做的。这可能取决于许多因素，例如 iOS 版本、用户区域设置、天气。

由于你在 UIWebView 中，我猜你的 HTML 仅限于 iPhone。那么为什么不制作特定的 iPhone 手机链接，而不是依赖神奇的东西呢？ :) :

<a href="tel:+1-800-275-2273">
Call John Appleseed at 1-800-275-2273
</a>.

如果需要的话，您甚至可以使用您自己的电话号码检测/格式算法将一些 javascript 注入到 html 中...

Phone number parsing is magic, and I'm afraid only Apple magicians have the powers to tell you how they do. And it is possible that it depends on many factors like iOS version, user locale, weather.

Since you're in a UIWebView I guess your HTML is iPhone only. Then why not making specific iPhone phone links, instead of relying on magic stuff? :) :

<a href="tel:+1-800-275-2273">
Call John Appleseed at 1-800-275-2273
</a>.

You could even inject some javascript into html with your own phone number detection/format algorithm if needed...

回复 原文
~没有更多了~

关于作者

别再吹冷风

暂无简介

0 文章
0 评论
378 人气
发私信

相关话题

更多

热门标签

操作系统 程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端
更多

推荐作者

lorenzathorton8

文章 0 评论 0

Zero

文章 0 评论 0

萧瑟寒风

文章 0 评论 0

mylayout

文章 0 评论 0

tkewei

文章 0 评论 0

17818769742

文章 0 评论 0

更多

友情链接

文江博客
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。
    原文