Javascript 国际电话输入与国家同步插件不工作

我在asp.NETWebForm网站上使用电话和手机字段

目前，我正在使用它作为一个基本的插件，如本文所示

现在我正在尝试将其与国家/地区下拉列表同步，这样当用户选择国家/地区时，它就会自动选择电话字段和web表单上的移动字段，并在电话字段中选择国家/地区

我试着使用这个例子，但它不工作，要么它破坏插件，要么它停止工作

我尝试的代码

var countryData = $.fn.intlTelInput.getCountryData(),
                telInput = $("#ContentPlaceHolder1_txtPhone"),
                addressDropdown = $("#ContentPlaceHolder1_ddCountry");

            // set it's initial value
            //var initialCountry = telInput.intlTelInput("getSelectedCountryData").iso2;
            //addressDropdown.val(initialCountry);
            // listen to the telephone input for changes
            telInput.on("countrychange", function (e, countryData) {
                addressDropdown.val(countryData.iso2);
            });
            // listen to the address dropdown for changes
            addressDropdown.change(function () {
                telInput.intlTelInput("setCountry", $(this).val());
            });

我在密码笔上有密码

我不知道我哪里做错了。我几乎没试过什么东西，但运气不好

---

我从数据库表中提取国家数据下拉列表，而不是插件，这样可能会在某个地方引起问题。但是国家代码也匹配。

我解决了这个问题，似乎是国家代码的问题，因为国家代码是大写的，而将其改为小写似乎解决了这个问题

工作样本

国家*
阿富汗
奥兰群岛
阿尔巴尼亚
阿尔及利亚
美属萨摩亚
安道尔
安哥拉
安圭拉
南极洲
安提瓜和巴布达
阿根廷
亚美尼亚
阿鲁巴
澳大利亚
奥地利
阿塞拜疆
巴哈马
巴林
孟加拉国
*
手机号码*

var countryData = $.fn.intlTelInput.getCountryData(),
                telInput = $("#ContentPlaceHolder1_txtPhone"),
                addressDropdown = $("#ContentPlaceHolder1_ddCountry");

            // set it's initial value
            //var initialCountry = telInput.intlTelInput("getSelectedCountryData").iso2;
            //addressDropdown.val(initialCountry);
            // listen to the telephone input for changes
            telInput.on("countrychange", function (e, countryData) {
                addressDropdown.val(countryData.iso2);
            });
            // listen to the address dropdown for changes
            addressDropdown.change(function () {
                telInput.intlTelInput("setCountry", $(this).val());
            });

<div class="col-xs-12 col-sm-12 col-md-6">
  <label class="cf-label">Country*</label>
  <select name="ctl00$ContentPlaceHolder1$ddCountry" id="ContentPlaceHolder1_ddCountry" class="form-control ddCountry styled-select">
    <option value="af">Afghanistan</option>
    <option value="ax">Åland Islands</option>
    <option value="al">Albania</option>
    <option value="dz">Algeria</option>
    <option value="as">American Samoa</option>
    <option value="ad">Andorra</option>
    <option value="ao">Angola</option>
    <option value="ai">Anguilla</option>
    <option value="aq">Antarctica</option>
    <option value="ag">Antigua And Barbuda</option>
    <option value="ar">Argentina</option>
    <option value="am">Armenia</option>
    <option value="aw">Aruba</option>
    <option value="au">Australia</option>
    <option value="at">Austria</option>
    <option value="az">Azerbaijan</option>
    <option value="bs">Bahamas</option>
    <option value="bh">Bahrain</option>
    <option value="bd">Bangladesh</option>
</select>
  <span data-val-controltovalidate="ContentPlaceHolder1_ddCountry" data-val-errormessage="*" data-val-display="Dynamic" data-val-validationgroup="vgDonationtForm" id="ContentPlaceHolder1_rfCountry" class="CssValidator" data-val="true" data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid"
    data-val-initialvalue="-- Select --" style="display:none;">*</span>
</div>

<div class="col-xs-12 col-sm-12 col-md-6">
  <label class="label">Mobile Number *</label>
<input name="ctl00$ContentPlaceHolder1$txtPhone" id="ContentPlaceHolder1_txtPhone" class="rg-txt rg-phone-txt form-control cf-input" autocomplete="off" placeholder="+971 50 123 4567" type="text">
</div>