jQuery - Ajouter chaque valeur d'entrée à un

Question

J'ai une zone de texte, par exemple 4 entrées, je veux ajouter chaque valeur à une certaine zone de texte avec une virgule sur la fonction KeyUp à côté de la valeur par défaut, mais le problème est qu'il écrasera la valeur précédente valeur.

veulent quelque chose comme ceci:

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

Essayez ceci:

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

De cette façon, vous ajoutez à la fin de la dernière valeur ajoutée

Answer 2

utilisation .change() au lieu de .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

Vous pouvez faire quelque chose comme

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

utiliser ce code 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()); 
    }); 
});