隐藏输入字段并使用 jQuery 将它们设为 3 个单独的输入字段并将值放入其中

Question

由于验证问题，我不想通过 HTML 添加 3 input fields 来执行此操作。这就是为什么我要采用jQuery 方法，但我无法让它发挥作用。我已经把我的代码放在jSFiddle --> http://jsfiddle.net/qV8Cc/，希望有人能帮助我。

我想要的是：您现在有 1 个输入字段。这个对用户来说一定是不可见的（这就是我把它隐藏的原因）。我希望他们看到的是 3 个单独的输入字段，它们并排放置。我为此使用了隐藏和附加，但我无法让它工作。因为我只验证了一个输入字段（我们隐藏的第一个），所以我想要其他 3 个中写入的值，转到隐藏的输入字段。有人可以帮我解决这个问题吗？

代码如下：

$().ready(function(e){
$('.classnameofmyinputfield').hide();
$('.classnameofmyinputfield').parent.append('<input classname><input classname><input classname>');
$('.classnameofmyinputfield').blur(function(e){
    var input = $(this);
    $('.classnameofmyinputfield').val($('.classname').val()+$('.classname').val()+$('.classname').val());


})


});

Answer 1

试试这个

$(document).ready(function(e){
    $('#profiel_rekeningnummer').parent().append('<input name="field1" id="field1" class="field"/><input name="field2" id="field2" class="field"/><input name="field3" id="field3" class="field"/>');

    $('.field').blur(function(e){
   $('#profiel_rekeningnummer').val($('#field1').val()+$('#field2').val()+$('#field3').val());
        alert($('#profiel_rekeningnummer').val());
    });
});

EXAMPLE

Answer 2

你需要类似的东西，而不是你的 blur 方法：

$('input.classname').blur(function() {
    var $hiddeninput = $('.classnameofmyinputfield');
    $hiddeninput .val(''); // clear the hidden field
    $('input.classname').each(function() {
        $hiddeninput .val(hiddeninput.val() + $(this).val()); // add value from each of the 3 shown input fields
    });
});