【问题标题】:How can we get contry code from given number Using IntlTelInput plugin?我们如何使用 Intl Tel Input 插件从给定号码获取国家代码?
【发布时间】:2018-01-08 04:19:22
【问题描述】:

var givenNumber = "+918288889889";

使用 IntlTelInput 插件如何获取“给定数字”的国家代码?

【问题讨论】:

    标签: jquery jquery-plugins intl-tel-input


    【解决方案1】:

    从文档here 中,您可以像这样使用名为 getSelectedCountryData 的方法:

    var countryData = $("#phone").intlTelInput("getSelectedCountryData");
    

    Witch 会返回如下内容:

    {
      name: "Afghanistan (‫افغانستان‬‎)",
      iso2: "af",
      dialCode: "93"
    }
    

    然后你可以像这样处理这些数据:

    var countryCode = countryData.dialCode;
    

    以上行将为您提供国家/地区拨号代码。

    【讨论】:

    • 我没有任何 html 元素,什么也没有。我只有数据库中的数字。我需要它的国家代码。就像使用 intlTelInputUtils.formatNumber("+918889889889",null,4) ans : 88898 89889 一样我想要国家代码
    • 所以你想要 php 或 sql 或什么的解决方案?
    • 我想要它在 javascript 中
    【解决方案2】:

    只需使用此代码从电话号码中获取国家代码:

    你可以使用var getCode = telInput.intlTelInput('getSelectedCountryData').dialCode;

    这里是演示:https://output.jsbin.com/cuvoqagotu

    https://jsbin.com/cuvoqagotu/edit?html,css,js

    HTML:

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <title>JS Bin</title>
      <script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/css/intlTelInput.css">
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/js/intlTelInput.min.js"></script>
    <style>
     .hide {
        display: none;
     }
    </style>
    </head>
    <body>
    <input id="phone" type="tel">
    <span id="valid-msg" class="hide">? Valid</span>
    <span id="error-msg" class="hide">Invalid number</span>
    </body>
    </html>
    

    JS:

    var telInput = $("#phone"),
      errorMsg = $("#error-msg"),
      validMsg = $("#valid-msg");
    
    // initialise plugin
    telInput.intlTelInput({
    utilsScript:"https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/11.0.4/js/utils.js"
    });
    
    var reset = function() {
      telInput.removeClass("error");
      errorMsg.addClass("hide");
      validMsg.addClass("hide");
    };
    
    // on blur: validate
    telInput.blur(function() {
      reset();
      if ($.trim(telInput.val())) {
        if (telInput.intlTelInput("isValidNumber")) {
          validMsg.removeClass("hide");
          /* get code here*/
          var getCode = telInput.intlTelInput('getSelectedCountryData').dialCode;
          alert(getCode);
        } else {
          telInput.addClass("error");
          errorMsg.removeClass("hide");
        }
      }
    });
    
    // on keyup / change flag: reset
    telInput.on("keyup change", reset);
    

    【讨论】:

    • 我没有任何 html 元素,什么也没有。我只有数据库中的数字。我需要它的国家代码。就像使用 intlTelInputUtils.formatNumber("+918889889889",null,4) ans : 88898 89889 一样我想要国家代码
    【解决方案3】:

    如果您不需要拨号代码而是国家代码。

    在 intltelinput 中输入电话号码后,从下面这一行获取国家代码。

    var countrycode = document.getElementsByClassName('country active')[0].getAttribute("data-country-code")
    

    更新答案

    使用像numverify 这样的第三方 api 是一个不错的选择。滚动到页面底部,您将看到 js 中的示例。如果您坚持使用数据库中的数据,我认为有必要自己编写后端代码(如 php)。

    // set endpoint and your access key
    var access_key = 'YOUR_ACCESS_KEY';
    var phone_number = '14158586273';
    
    // verify phone number via AJAX call
    $.ajax({
        url: 'http://apilayer.net/api/validate?access_key=' + access_key + '&number=' + phone_number,   
        dataType: 'jsonp',
        success: function(json) {
    
        // Access and use your preferred validation result objects
        console.log(json.valid);
        console.log(json.country_code);
        console.log(json.carrier);
    
        }
    });
    

    【讨论】:

    • 我没有任何 html 元素,什么也没有。我只有数据库中的数字。我需要它的国家代码。就像使用 intlTelInputUtils.formatNumber("+918889889889",null,4) ans : 88898 89889 一样我想要国家代码
    猜你喜欢
    • 2017-06-14
    • 2019-09-27
    • 2021-08-17
    • 1970-01-01
    • 2020-03-15
    • 2019-02-16
    • 2016-05-30
    • 1970-01-01
    • 2021-08-28
    相关资源
    最近更新 更多