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