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

jQuery - 将每个输入值附加到一个

jQuery - Append each input value to one

html

onkeypress