我正在使用一个intl tel输入插件来获取国家代码下拉列表和国家标志。我有另一个输入字段，它有一个国家名称作为下拉列表。我想要的是，当用户从国家下拉列表中选择任何国家时，国家代码会自动在国家代码下拉列表中被选中。我使用了几种方法，但都不适用，我也没有找到合适的插件文档。这是我的密码。
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.8/css/intlTelInput.css" />
</head>
<body>
<div class="container-fluid">
<div class="row">
<h1>Select Country</h1>
</div>
<div class="row">
<div class="col-md-12 form-group">
<div class="col-md-6 form-group hire-input-country_box position-relative">
<select name="country" class="form-control" id="country">
<option data-countryCode="DZ" value="213">Algeria</option>
<option data-countryCode="AD" value="376">Andorra</option>
<option data-countryCode="AO" value="244">Angola</option>
<option data-countryCode="AI" value="1264">Anguilla</option>
<option data-countryCode="AG" value="1268">Antigua & Barbuda
</option>
</select>
</div>
</div>
<div class="col-md-12 form-group">
<input type="tel" id="txtPhone" class="txtbox" />
</div>
</div>
</div>
<!-- Use as a jQuery plugin -->
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.8/js/intlTelInput-jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#country").change(function()
{
let value="+"+$(this).val();
$('#txtPhone').val(value);
})
var code = "+977"; // Assigning value from model.
$('#txtPhone').val(code);
$('#txtPhone').intlTelInput({
});
});
</script>
</body>
</html>
要执行所需操作，请调用intlTelInput的setCountry选项，并从所选option:中提供country-code数据属性值
$(function() {
$("#country").change(function() {
let countryCode = $(this).find('option:selected').data('country-code');
let value = "+" + $(this).val();
$('#txtPhone').val(value).intlTelInput("setCountry", countryCode);
});
var code = "+977";
$('#txtPhone').val(code).intlTelInput();
});<div class="container-fluid">
<div class="row">
<h1>Select Country</h1>
</div>
<div class="row">
<div class="col-md-12 form-group">
<div class="col-md-6 form-group hire-input-country_box position-relative">
<select name="country" class="form-control" id="country">
<option data-country-code="DZ" value="213">Algeria</option>
<option data-country-code="AD" value="376">Andorra</option>
<option data-country-code="AO" value="244">Angola</option>
<option data-country-code="AI" value="1264">Anguilla</option>
<option data-country-code="AG" value="1268">Antigua & Barbuda
</option>
</select>
</div>
</div>
<div class="col-md-12 form-group">
<input type="tel" id="txtPhone" class="txtbox" />
</div>
</div>
</div>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.8/js/intlTelInput-jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.8/css/intlTelInput.css" />