Question

我希望根据下拉列表的选择将国家/地区代码添加到电话号码中。到目前为止，我有：

jQuery(function($) {
var input = $( "#Phone" );
var country = "";
$('#Country').on('change', function() {
  var inputval = input.val();
  if ($(this).val() == "United States") {
    country = "1 ";
    input.val(country + inputval);
  } else if($(this).val() == "United Kingdom"){
    country = "+44 ";
    input.val(country + inputval);
  }
});
});

它会更新数字是但是如果我从美国切换到英国，它会保留1或+44。

Answer 1

好的，试试这个;

HTML模板;

<select id="country">
   <option value="+91"> India </option>
   <option value="+1"> USA </option>
   .....
</select>

考虑电话号码的输入字段如下：

<input type="number" id="phone">

现在是JS;

var phone="";
var prefix="";
$("#phone").keyup(function(){
     phone=$(this).val().replace(prefix,"");
})

$("#country").change(function(){
    $("#phone").val($(this).val()+phone);
    prefix=$(this).val();

    /* explanation
     * setting the value of  $("#phone")
     * concatenating  $(this).val() [basically the select] and the value of
     * $("#phone") itself which is stored in phone variable
     */

})

Answer 2

编辑：

修改后的示例，只使用一个条目并在更改国家/地区代码时保留电话号码：

https://jsfiddle.net/ryqxpwst/1/

这种方法如何：拥有国家/地区代码的条目和电话号码的不同条目（如果绝对必要，您可以在提交表单之前将两者结合起来）：

jQuery(function($) {
var input = $( "#Phone" );
var ccode = $('#ccode');
var country = "";
$('#Country').on('change', function() {
  console.log('change..' + $("#Country option:selected").val() );
  var inputval = input.val();
  ccode.val($("#Country option:selected").val());  
});
});

工作小提琴： https://jsfiddle.net/ryqxpwst/

希望它有所帮助！

使用jquery预先输入文本到输入

2 个答案: