Как для телефонов?



Я хочу пометить номер телефона как вызываемую ссылку в HTML-документе. Я читал микроформаты подход, и я знаю, что tel: схема была бы стандартной, но совершенно буквально нигде не реализована.



Skype определяет, насколько я знаю,skype: и callto:, последний приобрел некоторую популярность. Я предполагаю, что у других компаний есть либо другие схемы, либо прыгать на callto: поезд.



что было бы лучшей практикой для разметка номер телефона, так что как можно больше людей, как это возможно с программным обеспечением VoIP можно просто нажать на ссылку, чтобы получить вызов?



бонусный вопрос: кто-нибудь знает об осложнениях с номерами экстренных служб, таких как 911 в США или 110 в Германии?



спасибо,



обновление: Microsoft NetMeeting принимает callto: схемы под WinXP. этот вопрос предполагает, что Microsoft Office Communicator будет обрабатывать tel: схемы, но не callto: те. Отлично, Редмонд!



обновление 2: два с половиной года спустя. Это, кажется, сводится к тому, что вы хотите сделать с номером. В мобильном контексте,tel: - это путь. Таргетинг настольных компьютеров это зависит от вас, если вы думаете, что ваши пользователи больше людей Skype (callto:) или, скорее всего, будет что-то вроде Google Voice (tel:) установлен. Мое личное мнение, когда сомневаешься пользуйся tel: (в соответствии с @Sidnicious' ответ.)



обновление 3: пользователь @rybo111 отметил, что Skype в Chrome тем временем прыгнул на tel: подножку. Я не могу проверить это, потому что нет машины с обоими под рукой, но если это правда, это означает, что мы наконец-то победили здесь:



                                        tel:
574   14  

14 ответов:

The tel: схемы использовать в конце 1990-х годов и задокументировано в начале 2000 года с RFC 2806 (который был заменен на более основательный RFC 3966 в 2004 году) и продолжает совершенствоваться. Поддержка tel: на iPhone не было произвольного решения.

callto:, в то время как поддерживается Skype,не является стандартным и следует избегать, если специально не нацелены на пользователей Skype.

меня? Я бы просто начал включать правильно сформированные tel: URI на ваших страницах (без нюхания агента пользователя) и ждать, пока остальные телефоны в мире, чтобы догнать :) .

пример:

<a href="tel:+18475555555">1-847-555-5555</a>

мои результаты теста:

callto:

  • браузер Nokia: ничего не происходит
  • Google Chrome: просит запустить skype, чтобы позвонить по номеру
  • Firefox: просит выбрать программу для вызова номера
  • IE: просит запустить skype, чтобы позвонить по номеру

tel:

  • браузер Nokia: работает
  • Google Chrome: ничего не происходит
  • Firefox: "Firefox не знает, как открыть этот url"
  • IE: не удалось найти url

лучше всего начать с tel: который работает на всех мобильных телефонах

затем введите этот код, который будет работать только тогда, когда на рабочем столе, и только при нажатии на ссылку.

Я использую http://detectmobilebrowsers.com/ чтобы обнаружить мобильные браузеры, вы можете использовать любой метод, который вы предпочитаете

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

Так что в основном вы покрываете все ваши базы.

тел: работает на всех телефонах, чтобы открыть номеронабиратель с номером

callto: работает на вашем компьютере для подключения к skype из firefox, chrome

Как и следовало ожидать, поддержка WebKit tel: распространяется на мобильные Android-браузера, а также - к вашему сведению

я сохраняю этот ответ для "исторической" цели, но больше не рекомендую его. См. ответ @Sidnicious выше и мое обновление 2.

поскольку это похоже на ничью между callto и tel guys, я хочу бросить возможное решение в надежде, что ваши комментарии вернут меня на путь света ; -)

используя callto:, так как большинство настольных клиентов будет обрабатывать это:

<a href="callto:0123456789">call me</a>

затем, если клиент является iPhone, замените ссылки:

window.onload = function () {
  if (navigator.userAgent.match (/iPhone/i)) {
    var a = document.getElementsByTagName ("a");
    for (var i = 0; i < a.length; i++) {
      if (a[i].getAttribute ('href').search (/callto:/i) === 0) {
        a[i].setAttribute ('href', a[i].getAttribute ('href').replace (/^callto:/, "tel:"));
      }
    }
  }
};

есть возражения против этого решения? Я должен предпочтительно начать с tel:?

Mobile Safari (iPhone & iPod Touch) используйте tel: схема.

как набрать номер телефона с веб-страницы на iPhone?

RFC3966 определяет стандартный URI IETF для телефонных номеров, то есть 'tel:' URI. Это стандарт. Нет аналогичного стандарта, который указывает " callto:", это особое Соглашение для Skype на платформах, где is позволяет регистрировать обработчик URI для его поддержки.

это сработало для меня:

1.сделайте ссылку, соответствующую стандартам:

        <a href="tel:1500100900">

2.замените его, когда мобильный браузер не обнаружен, для skype:

$("a.phone")
    .each(function()
{ 
  this.href = this.href.replace(/^tel/, 
     "callto");
});

выбор ссылки для замены через класс кажется более эффективным. Конечно, он работает только на якорях с .phone класса.

я поставил его в функцию if( !isMobile() ) { ... так он срабатывает только при обнаружении настольного браузера. Но этот, вероятно, устарел...

function isMobile() {
    return (
        ( navigator.userAgent.indexOf( "iPhone" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "iPod" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "iPad" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "Android" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "webOS" ) > -1 )
    );
}

Я tel: для моего проекта.

Он работал в Chrome, Firefox, IE9&8, Chrome mobile и мобильном браузере на моем смартфоне Sony Ericsson.

но callto: не работает в мобильных браузерах.

хотя Apple рекомендует tel: в своих документах для мобильного Safari, в настоящее время (iOS 4.3) он принимает callto: точно так же. Поэтому я рекомендую использовать callto: на общем веб-сайте, поскольку он работает как с Skype, так и с iPhone, и я ожидаю, что он будет работать и на телефонах Android.

Обновление (Июнь 2013 Года)

это все еще вопрос принятия решения, что вы хотите, чтобы ваша веб-страница, чтобы предложить. На моих сайтах я предоставляю оба tel: и callto: ссылки (последние помечены как для Skype) так как настольные браузеры на Mac ничего не делают с tel: ссылки в то время как мобильный Android ничего не делает с callto: ссылки. Даже Google Chrome с плагином Google Talk не отвечает на tel: ссылки. Тем не менее, я предпочитаю предлагать обе ссылки на рабочем столе в случае, если кто-то пошел на проблемы с получением tel: ссылки для работы на своем компьютере.

если бы дизайн сайта диктовал, что я предоставляю только одну ссылку, я бы использовал tel: ссылка, которую я бы попытался изменить callto: на настольных браузерах.

Я хотел бы использовать tel: (Как рекомендуется). Но чтобы иметь лучший резерв / не отображать страницы ошибок, я бы использовал что-то вроде этого (используя jquery):

// enhance tel-links
$("a[href^='tel:']").each(function() {
    var target = "call-" + this.href.replace(/[^a-z0-9]*/gi, "");
    var link = this;

    // load in iframe to supress potential errors when protocol is not available
    $("body").append("<iframe name=\"" + target + "\" style=\"display: none\"></iframe>");
    link.target = target;

    // replace tel with callto on desktop browsers for skype fallback
    if (!navigator.userAgent.match(/(mobile)/gi)) {
        link.href = link.href.replace(/^tel:/, "callto:");
    }
});

предполагается, что мобильные браузеры, которые имеют мобильный штамп в строке userAgent, поддерживают tel: протокол. В остальном мы заменяем ссылку на callto: протокол для резервного копирования в Skype, где это возможно.

чтобы подавить страницы ошибок для неподдерживаемых протоколов, ссылка нацелены на новый скрытый iframe.

к сожалению, это не представляется возможным проверить, если url был успешно загружен в iframe. Похоже, что никакие события ошибок не запускаются.

С callto: по умолчанию поддерживается skype (настраивается в настройках Skype), а другие также поддерживают его, я бы рекомендовал использовать callto:, а не skype: .

используя jQuery, замените все телефонные номера США на странице с соответствующим callto: или tel: схемы.

// create a hidden iframe to receive failed schemes
$('body').append('<iframe name="blackhole" style="display:none"></iframe>');

// decide which scheme to use
var scheme = (navigator.userAgent.match(/mobile/gi) ? 'tel:' : 'callto:');

// replace all on the page
$('article').each(function (i, article) {
    findAndReplaceDOMText(article, {
        find:/\b(\d\d\d-\d\d\d-\d\d\d\d)\b/g,
        replace:function (portion) {
            var a = document.createElement('a');
            a.className = 'telephone';
            a.href = scheme + portion.text.replace(/\D/g, '');
            a.textContent = portion.text;
            a.target = 'blackhole';
            return a;
        }
    });
});

спасибо @jonas_jonas за идею. Требуется отличный функция findAndReplaceDOMText.

Я использую нормальный <a href="tel:+123456">12 34 56</a> разметка и сделать эти ссылки не кликабельны для настольных пользователей через pointer-events: none;

a[href^="tel:"] {
    text-decoration: none;
}
.no-touch a[href^="tel:"] {
    pointer-events: none;
    cursor: text;
}

для браузеров, которые не поддерживают события указателя (IE

if(!Modernizr.touch) {
    $(document).on('click', '[href^="tel:"]', function(e) {
        e.preventDefault();
        return false;
    });
}

Comments

    Ничего не найдено.