使用intlTelInput

时间:2017-10-10 10:34:45

标签: javascript jquery intl-tel-input

我使用的是提供here

的intlTelInput的演示代码

我可以使用以下

获取拨号代码



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




但我无法获得完整的号码,即"拨号码+用户输入的号码"来自#phone文本框。

5 个答案:

答案 0 :(得分:4)

使用getnumber选项,因此在您的情况下:

var intlNumber = $("#phone").intlTelInput("getNumber");

^这将为您提供整个号码(国家代码+电话号码)

请在此处查看docs

答案 1 :(得分:0)

您必须使用内置方法来获取完整号码,但必须添加utilsScript

['hello', 'hello', 'hello', 'hello']

在初始化intlTelInput中,如此处所述Intl-Tel-Phone Docs

然后您可以通过使用

获取完整的号码
 $("#phone").intlTelInput(
    { 
      //Other configurations,
      //Other configurations,
      utilsScript : "/path/to/build/utils.js",

    });

答案 2 :(得分:0)

full_phone 会成功。
提交表单时,它会附加一个带有完整数字的隐藏字段。

var input = document.querySelector("#phone");
window.intlTelInput(input, {
    hiddenInput: "full_phone",
    utilsScript: "../../build/js/utils.js" 
});

更新: 如果上述技巧不起作用,请不要担心,您可以通过在电话输入字段之前放置一个隐藏的输入字段来修复它。

HTML:

var input = document.querySelector("#phone"),
  hidden= document.querySelector("#hidden");

var iti = window.intlTelInput(input, {
  nationalMode: true,
  utilsScript: "../../build/js/utils.js" 
});

var handleChange = function() {
hidden.value = iti.getNumber()
};

// 听“keyup”,也可以“change”在用户选择国家时更新

input.addEventListener('change', handleChange);
input.addEventListener('keyup', handleChange)

答案 3 :(得分:0)

使用 ajax 提交表单。 这对我有用。 我添加了 hiddenInput : "full_phone" 并将 "submit" 文件中的偶数侦听器从 "change" 更改为 intlTelInput.js

 var iti = document.querySelector("#phone");
  window.intlTelInput(iti, {
    separateDialCode: true,
    hiddenInput : "full_phone",
    utilsScript: "../../build/js/utils.js",
  });

intlTelInput.js 文件中

 if (this.telInput.form) this.telInput.form.addEventListener("change", this._handleHiddenInputSubmit);

答案 4 :(得分:0)

另一种选择是简单地使用 getInstance 然后使用 getNumber

var input = document.querySelector("#phone"),
window.intlTelInput(input, {
      utilsScript : "/path/to/build/utils.js",
  });
window.intlTelInputGlobals.getInstance(input).getNumber();