从jQuery国际电话输入插件获取带有国家/地区代码的完整号码

Question

我正在使用jQuery国际电话输入插件来获取国家代码和电话号码。 网页代码

<div class="form-group">
<input type="tel"  placeholder="Phone*" id="telephone" name="telephone" class="form-control">
</div>

插件初始化

jQuery("#telephone").intlTelInput({
// options here
allowDropdown:true,
autoHideDialCode:true,
autoPlaceholder:"polite",
separateDialCode:true,
customPlaceholder:null
});

如何使用电话号码GRT完整的国家/地区代码。

Answer 1

我无法使用jQuery重新创建插件。但是请参阅下面的香草JS示例。该插件有一个公共方法getNumber()您可以通过它获取数字。

var input = document.querySelector("#telephone");
let iti = window.intlTelInput(input, {
// options here
allowDropdown: true,
autoHideDialCode: true,
autoPlaceholder: "polite",
separateDialCode: true,
customPlaceholder: null,
utilsScript: "https://raw.githack.com/jackocnr/intl-tel-input/master/build/js/utils.js"
});
$(".get-number").on("click", function() {
console.log(iti.getNumber());
});

.get-number {
padding: 0.5em 1em;
background-color: lightblue;
border-radius: 0.2em;
display: inline-block;
margin: 1em 0;
cursor: pointer;
}

<script src="https://raw.githack.com/jackocnr/intl-tel-input/41735773e78c39aad6aaee53a6126215f64aeb57/build/js/intlTelInput.js"></script>
<link href="https://raw.githack.com/jackocnr/intl-tel-input/master/build/css/intlTelInput.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
<input type="tel" placeholder="Phone*" id="telephone" name="telephone" class="form-control">
</div>
<div class='get-number'>
Get Number
</div>