选择country，然后在下一次输入时自动显示国家代码
选择country，然后在下一次输入时自动显示国家代码
提问于 2021-07-01 01:37:55
我正在尝试添加一个人的国籍和电话号码。因此，我有一个包含国家名称的下拉列表和一个用于输入电话号码的输入框。当一个人选择国籍(国家)时，下一个输入的电话应该自动显示国家代码。因此，我必须在数据库中存储此人的国籍和电话号码。
<div class="form-group">
<label>Nationality</label>
<select name="country">
<option value="">Country...</option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
.
.
ETC till
<option value="Zimbabwe">Zimbabwe</option>
</select>
</div>
<div class="form-group">
<label for="phone">Phone Number</label><
<input id="phone" name="phone" placeholder="user's number " required="" type="number">
</div>我是否需要将它们存储在数据库表中并进行检索，或者有一种简单的方法可以做到这一点？
回答 2
Stack Overflow用户
发布于 2021-07-01 01:52:25
您可以将一些数据添加到您的选项标签中，并将其与jquery一起使用：
<option value="Zimbabwe" data-countrycode="+888">Zimbabwe</option>和jQuery：
<script>
$( "select[name=country]" ).change(function() {
$('input#phone').val($('option:selected', this).data('countrycode'));
});
</script>Stack Overflow用户
发布于 2021-07-01 02:01:46
你可以使用value="+nnn“，或者你可以使用一个对象来创建下拉列表，或者你可以从后端ajax这个值。给猫剥皮的方法有很多种。没有明确的答案
在这里，我在选项上添加了一个数据属性，并且可以使用该值或两者都使用
$("#areaCode").on("change", function() {
$('#dialCode').val($('option:selected', this).data('dialcode'));
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="areaCode">
<option value="" data-dialcode="">Please select</option>
<option value="Austria" data-dialcode="+43">Austria</option>
<option value="Zimbabwe" data-dialcode="+263">Zimbabwe</option>
</select>
<input type="text" id="dialCode"/>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68199319
复制相关文章
相似问题
腾讯云开发者
