从多个输入字段填充字段

Populating Field from Multiple Input Fields?

本文关键字:字段 填充 输入      更新时间:2023-09-26

我试图用Street Address, City, State和Zip填充字段,但是现在当我在每个字段中输入数据时,它会替换最后一个。

$("#trainer_address").keyup( function () {
        $('#location').val($(this).val());
    });
    $("#trainer_city").keyup( function () {
        $('#location').val($(this).val());
    });
    $("#trainer_state").keyup( function () {
        $('#location').val($(this).val());
    });
    $("#trainer_zip").keyup( function () {
        $('#location').val($(this).val());
    });

我如何让它保持前一个值,然后添加下一个值,这样我就可以像402 StreetAddress City State, 12345这样结束了?

下面的脚本会这样做:

var $loc = $('#location'),
    address = [],
getAddress = function() {
    var str = address.slice(0, 3).join(' ') + ', ' + (address[3] || '');
    return str.replace(/'s+/g, ' ').replace(/,'s$/, '');
}
$("#trainer_address, #trainer_city, #trainer_state, #trainer_zip").on({
    focus: function() {
        $loc.val(getAddress());
    },
    keyup: function() {
        address[$(this).index()] = $(this).val();
        $(this).trigger('focus');
    }
});
http://jsfiddle.net/J6G9f/1/

脚本也正确处理删除部分地址,并自动更新结果

使用+操作符将旧值与新值连接起来…您可以使用多个选择器来避免多个keyup函数....

试试这个

$("#trainer_address,#trainer_city,#trainer_state,#trainer_zip").keyup( function () {
  var location=$('#location').val();
  $('#location').val(location + $(this).val());
});

您可以像这样使用本机value:

$('#location')[0].value += this.value;

那是因为你覆盖了它。尝试连接:

$('#location').val($('#location').val() + $(this).val());

例如:

$("#trainer_zip").keyup( function () {
    $('#location').val($(this).val());
});

:

$("#trainer_zip").keyup( function () {
    $('#location').val($('#location').val() + $(this).val());
});

为每个keyup()事件函数执行此操作