從多個輸入字段填充字段？

我試圖用街道地址，城市，州和郵編填充一個字段，但現在當我將數據輸入到每個字段時，它將替換最後一個字段。從多個輸入字段填充字段？

$("#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結束了？

來源

2013-03-13 Joe Bobby

這很有趣。如果你回到第一個領域會發生什麼？是否應該追加一次？ – dfsq 2013-03-13 05:26:21

你想要的位置是地址+城市+州+郵編？ – Bemmu 2013-03-13 05:29:54

這是因爲你覆蓋它。嘗試串聯：

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

例如，更改此：

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

這樣：

做到這一點對每個keyup()事件功能

來源

2013-03-13 05:19:02 Jace

困惑於如何實施這個解決方案 – 2013-03-13 05:28:21

我已經爲你做了。 .... ....由於某種原因，請參閱我的編輯 – Jace 2013-03-13 05:43:18

串聯老VAL新val使用+運算符...並且您可以避免多個運算符KEYUP功能使用多重選擇器....

試試這個

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

來源

2013-03-13 05:19:50 bipen

，輸入'street'我最終與'streetstreetstreet' – 2013-03-13 05:27:14

您可以使用本機value這樣的：

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

來源

2013-03-13 05:21:41 elclanrs

如何添加此解決方案？ – 2013-03-13 05:29:00

您只需更換設置值的行。 – elclanrs 2013-03-13 05:30:20

這個腳本會做到這一點：

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/

腳本也可以正確處理刪除地址的部分，並自動更新結果。

來源

2013-03-13 05:38:48 dfsq

從多個輸入字段填充字段？

回答

相關問題