Question

我正在寻找一个jquery解决方案，该解决方案使用来自无限量输入框的值填充隐藏字段。隐藏字段中的值应以＆＃39;;＆＃39;分隔。应始终有一个空输入字段。将值输入此输入字段后，应显示一个新值。当一个字段被清空时，另一个空字段应该消失。

如果有可以执行此操作的插件，那么如果您能指出我正确的方向，我会非常高兴。

与此同时，我自己也在一起攻击了一些内容，我将作为答案发布。

Answer 1

以下代码将对应用了<input type="hidden" />类的每个endlessinput字段应用此逻辑。可能不是最美丽的代码，但它可以做我想做的事情： - ）

$("input[type='hidden'].endlessinput").each(function (i, n) {
    $parent = $(n).parent();
    $br = $('<br />');
    // define a textbox for each value and add an additional empty one
    var createInput = function () {
        var input = $('<input id="'+guid()+'" type="text" value="" />');
        input.unbind('keyup');
        input.bind('keyup', function () {
            // rebuild the array with values
            var arr = [];
            $("input[type='text']", $parent).each(function (k, y) {
                arr.push($(y).val());
            });
            $(n).attr('value', arr.join(';'));
            // Add another input field if no empty one is available
            emptyInputs = $('input:text[value=""]', $parent).filter(function (o, p) { return $(p).val() == '' });
            if (emptyInputs.length == 0) {
                $($("br", $parent).last().length > 0 ? $("br", $parent).last()[0] : $(n)).after(createInput(), "<br />");
            } else if (emptyInputs.length > 1) {
                emptyInputs.not(':first').each(function (ix, inp) {
                    $(inp).next('br').remove()
                    $(inp).remove();
                });
            }
        });
        return input;
    }

    // get values in an array
    var values = $(n).val().split(';');
    $(values).each(function (j, x) {
        var newInput = createInput();
        newInput.attr('value', x);
        $($("br", $parent).last().length > 0 ? $("br", $parent).last()[0] : $(n)).after(newInput, "<br />");
    });
    $($("br", $parent).last().length > 0 ? $("br", $parent).last()[0] : $(n)).after(createInput(), "<br />");
});

写入隐藏字段的无尽输入字段

1 个答案: