jQuery - добавить каждое значение ввода к одному

Question

У меня есть текстовое поле, например 4 входа, я хочу добавить каждое значение в одно определенное текстовое поле с запятой на функцию KeyUp рядом с значением по умолчанию, но проблема в том, что она перезапишет значение с помощью предыдущего стоимость.

хотят что-то вроде этого:

01115468852, 234324234, 423423113345, 43341889955

var curval = $('#PhoneTextbox').val(); 
 

 
$('.tag').each(function() { 
 
    $(this).keyup(function() { 
 
    var tags = $(this).val(); 
 
    $('#PhoneTextbox').attr('value', curval + " , " + tags); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<input id="PhoneTextbox" value="01115468852" type="text" /> 
 
<br /> 
 
<br /> 
 
<br /> 
 
<input class="tag" value="" type="text" /> 
 
<input class="tag" value="" type="text" /> 
 
<input class="tag" value="" type="text" /> 
 
<input class="tag" value="" type="text" />

Answer 1

Тест:

$('.tag').each(function() { 
    $(this).keyup(function() { 
     var tags = $(this).val(); 
     var curval = $('#PhoneTextbox').val(); 
     $('#PhoneTextbox').attr('value', curval + " , " + tags); 
    }); 
}); 

Таким образом, вы добавляете его в конце последнего добавленного значения

Answer 2

использования .change() вместо .keyup()

$('.tag').each(function() { 
 
$(this).change(function() { 
 
    var tags = $(this).val(); 
 
    var curval = $('#PhoneTextbox').val(); 
 
    $('#PhoneTextbox').attr('value', curval + " , " + tags); 
 
}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<input id="PhoneTextbox" value="01115468852" type="text"/> 
 
<br /> 
 
<br /> 
 
<br /> 
 
<input class="tag" value="" type="text"/> 
 
<input class="tag" value="" type="text"/> 
 
<input class="tag" value="" type="text"/> 
 
<input class="tag" value="" type="text"/>

Answer 3

Вы можете сделать что-то вроде

var curval = $('#PhoneTextbox').val(); 
 

 
var $tags = $('.tag').keyup(function() { 
 
    var tags = $tags.map(function() { 
 
    return this.value || undefined 
 
    }).get(); 
 
    tags.unshift(curval) 
 

 
    $('#PhoneTextbox').val(tags); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<input id="PhoneTextbox" value="01115468852" type="text" /> 
 
<br /> 
 
<br /> 
 
<br /> 
 
<input class="tag" value="" type="text" /> 
 
<input class="tag" value="" type="text" /> 
 
<input class="tag" value="" type="text" /> 
 
<input class="tag" value="" type="text" />

Answer 4

использовать этот код Javascript

var p = $("#PhoneTextbox").val(); 
$(function(){ 
    $('.tag').keyup(function(){ 
     var t = []; 
     t.push(p); 
     $('.tag').each(function(i,e){ 
      if($(e).val().length > 0){ 
       t.push($(e).val()); 
      } 
     }); 
     $("#PhoneTextbox").val(t.join()); 
    }); 
});