草庐IT

php - 在网站上列出电话号码以进行点击通话的最佳方式

coder 2023-08-09 原文

在我构建的响应式网页(基于 twitter-bootstrap)上，我有许多元素是不可见的，除非以较小的分辨率(即平板电脑和手机)查看页面。

我发现 - 至少对于运行 OS7 的 iPhone - 电话号码最好保留为没有链接的数字。 iPhone 将数字格式检测为电话号码，添加它自己的 href，当您按下该号码时，它会询问您是否要调用它 - see screenshot 1 .

但是，如果我将我的文本或电话号码包含在带有 tel: 标记的 a href 中(正如许多“专家”所建议的那样)，当我单击该链接时，什么也不会发生。我必须长按链接(按住它超过一秒钟)，然后它才会为我提供电话号码的不同选项 - see screenshot 2 .

这可以克服吗？或者有没有更好的方法来列出电话号码，以便移动设备可以点击调用他们(对最终用户来说步骤最少)？

谢谢

编辑: 经过进一步的页面测试，我发现 <a href="tel:xxxxxxxx">call link</a>工作正常 - 除了当它在我的页面正在使用的导航菜单中时。 该站点在移动时切换到下拉式菜单，它位于我放置调用链接的这个无序列表的顶部。 例如。 

<nav>
     <ul>
         <li class="mobile-only"><a href="tel:1800251800">Call now on <i class="icon-phone"></i> 1800 25 1800</a></li>
         <li><a href="#section-home" class="active">Home</a></li>
         <li><a href="#our-team">Team</a></li>
         <li><a href="#our-services">Services</a></li>
         <li><a href="#contact-section">Contact</a></li>
     </ul>
</nav>

我有 display:none;设置为 .mobile-only在我的样式表中，当@media (max-width:768px)达到了，我有display:block;设置为 .mobile-only (以及其他样式)。

所以我认为导航栏中的某些内容或用于在正常模式和移动模式之间切换导航栏的代码正在阻止我的调用链接正常工作。

有什么想法吗？

最佳答案

tel: 方案是 used in the late 1990s并在 2000 年初记录在案 RFC 2806 (在 2004 年被更彻底的 RFC 3966 淘汰)和 continues to be improved .在 iPhone 上支持 tel: 并不是一个武断的决定。

我建议开始在您的页面上包含格式正确的 tel: URI(不要嗅探用户代理)，然后等待世界其他地区的手机 catch 来。

或者，如果你想为 iPhone 删除 tel:，你可以使用这个 jQuery 片段:

 //if iPhone
 jQuery('body').on('click', 'a[href^="tel:"]', function() {
         jQuery(this).attr('href', 
             jQuery(this).attr('href').replace(/^tel:/, ''));
 });

关于php - 在网站上列出电话号码以进行点击通话的最佳方式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24774014/

站上通话codehrefsectionphpjqueryhtmlcss

有关php - 在网站上列出电话号码以进行点击通话的最佳方式的更多相关文章

  1. ruby-on-rails - 使用 Ruby on Rails 进行自动化测试 - 最佳实践 - 2

    很好奇，就使用ruby​​onrails自动化单元测试而言，你们正在做什么？您是否创建了一个脚本来在cron中运行rake作业并将结果邮寄给您？git中的预提交Hook？只是手动调用？我完全理解测试，但想知道在错误发生之前捕获错误的最佳实践是什么。让我们理所当然地认为测试本身是完美无缺的，并且可以正常工作。下一步是什么以确保他们在正确的时间将可能有害的结果传达给您？ 最佳答案 不确定您到底想听什么，但是有几个级别的自动代码库控制:在处理某项功能时，您可以使用类似autotest的内容获得关于哪些有效，哪些无效的即时反馈。要确保您的提

  2. ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2

    我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i

  3. ruby-on-rails - Ruby on Rails 可以部署在 Azure 网站上吗？ - 2

    我可以在Azure网站上部署RubyonRails吗？ 最佳答案 还没有。目前仅支持.NET和PHP。 关于ruby-on-rails-RubyonRails可以部署在Azure网站上吗？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/12964010/

  4. ruby-on-rails - Rails 中同一个类的多个关联的最佳实践？ - 2

    我认为我的问题最好用一个例子来描述。假设我有一个名为“Thing”的简单模型，它有一些简单数据类型的属性。像...Thing-foo:string-goo:string-bar:int这并不难。数据库表将包含具有这三个属性的三列，我可以使用@thing.foo或@thing.bar之类的东西访问它们。但我要解决的问题是当“foo”或“goo”不再包含在简单数据类型中时会发生什么？假设foo和goo代表相同类型的对象。也就是说，它们都是“Whazit”的实例，只是数据不同。所以现在事情可能看起来像这样......Thing-bar:int但是现在有一个新的模型叫做“Whazit”，看起来

  5. ruby-on-rails - 向 Rails 3 添加 Ruby 扩展方法的最佳实践？ - 2

    我有一个要在我的Rails3项目中使用的数组扩展方法。它应该住在哪里？我有一个应用程序/类，我最初把它放在(array_extensions.rb)中，在我的config/application.rb中我加载路径:config.autoload_paths+=%W(#{Rails.root}/应用程序/类)。但是，当我转到railsconsole时，未加载扩展。是否有一个预定义的位置可以放置我的Rails3扩展方法？或者，一种预先定义的方式来添加它们？我知道Rails有自己的数组扩展方法。我应该将我的添加到active_support/core_ext/array/conversion

  6. ruby - 最佳原则中的原则 - 2

    我似乎经常遇到一些设计问题，但我不知道是什么是真的很合适。一方面我经常听到我应该限制耦合和坚持单一职责，但当我这样做时，我常常发现它很困难到在需要时将信息获取到程序的一部分。为了例如，classSingerdefinitialize(name)@name=nameendattr:nameend那么Song应该是:classSongdefnew(singer)@singer=singerendend或classSongdefnew(singer_name)@singer_name=singer_nameendend后者耦合性小，按道理应该用。但如果我以后发现宋有什么需要了解更多歌手，我的

  7. ruby-on-rails - 与 ActiveMerchant 一起使用的最佳支付网关是什么？ - 2

    我需要使用ActiveMerchant库在我们的一个Rails应用程序中设置支付解决方案。尽管这个问题非常主观，但人们对主要网关(BrainTree、Authorize.net等)的体验如何？它必须:处理定期付款。有能力记入个人帐户。能够取消付款。有办法存储用户的付款详细信息(例如Authotize.netsCIM)。干杯 最佳答案 ActiveMerchant很棒，但在过去一年左右的时间里，我在使用它时发现了一些问题。首先，虽然某些网关可能会得到“支持”——但并非所有功能都包含在内。查看功能矩阵以确保完全支持您选择的网关-http

  8. ruby - 将 ruby​​ 哈希转换为数组的最佳方法是什么 - 2

    我有一个像这样的ruby​​散列{"stuff_attributes"=>{"1"=>{"foo"=>"bar","baz"=>"quux"},"2"=>{"foo"=>"bar","baz"=>"quux"}}}我想把它变成一个看起来像这样的散列{"stuff_attributes"=>[{"foo"=>"bar","baz"=>"quux"},{"foo"=>"bar","baz"=>"quux"}]}我还需要保留键的数字顺序，并且键的数量是可变的。上面是super简化的，但我在底部包含了一个真实的例子。执行此操作的最佳方法是什么？附言还需要递归就递归而言，这是我们可以假设的:1)

  9. Ruby 最佳实践 : working with classes - 2

    参见下面的示例，我想最好使用第二种方法，但第一种也可以。哪种方法最好，使用另一种的后果是什么？classTestdefstartp"started"endtest=Test.newtest.startendclassTest2defstartp"started"endendtest2=Test2.newtest2.start 最佳答案 我肯定会说第二种变体更有意义。第一个不会导致错误，但对象实例化完全过时且毫无意义。外部变量在类的范围内不可见:var="string"classAvar=A.newendputsvar#=>strin

  10. ruby - 如何在非 SSL 或 http 网站上使用 Stripe？ - 2

    我正在使用Rails3.2.6和Stipe进行支付。是否有可能在不购买ssl证书的情况下进行付款。我可以使用Stripe页面作为我的支付页面吗？ 最佳答案 您可以使用stripe.js在技术上跳过SSL但我强烈建议您设置SSL。它所做的是将信用卡信息直接传递给stripe，然后stripe会给你一个token，用于实际进行收费。这样做意味着信用卡信息永远不会接触您的服务器，您不必担心PCI合规性。但是，您仍应设置SSL以防止中间人攻击。您可以在https://stripe.com/docs/tutorials/forms找到有关如何

随机推荐