Question

我每次克隆时都试图为隐藏字段值添加+1。例如，最后一个克隆字段值为2，当我克隆新克隆字段值为3时，工作正常。

但问题是：例如，这些是现有的克隆字段。

字段值1 字段值2 场地价值3 字段值4

如果我删除3并添加新内容，那么它将是：

字段值1 字段值2 场地价值4 字段值4

我不想再次使用相同的值。

<ul id="#wrapper">
    <li class="wrap">
        <input type="text" class="dateField" value="" name="date" />
        <input type="text" class="timeField" value="" name="time" />
        <input type="hidden" class="wrapId" value="1" name="wrapId" />
    </li>
</li>
<input id="addWrap" type="button" value="Make Clone" />


// Add Wrap
    var $wraper = $('#wraper');
    $('#addWrap').click(function (e) {
        var $cloneElem = $wraper.children('.wrap').last().clone();
        var $oldID = $('.wrapId').length;
        var $newID = Number($oldID + 1);
        $cloneElem.find('.wrapId').val($newID).end()
            .insertAfter($wraper.children('.wrap').last());

        adjustContainerHeight();
        e.preventDefault();
    });


    // Delete Wrap
    $wraper.delegate('.removeWrap', 'click', function (e) {
        if ($wraper.children('.wrap').length == 1) {
            $class.find('input.dateField').val('').end()
                .find('input.timeField').val('').end()
                .find('.wrapId').val('');
            alert('You need to have at least 1 wrap!');
        } else {
            $(this).parents('.wrap').remove();
        }
        e.preventDefault();
    });

Answer 1

<ul id="#wrapper">不应该包含#
您在点击处理程序

e.preventDefault();

在您关闭列表的位置，您</li>应该</ul>
当您只进行一次换行时，您不想设置('.wrapId').val('')，如果这样做，下一个克隆将会中断，因为它没有要添加的数字
代码可以大大简化

以下应该做你需要的。但有一件事，如果您删除最后一个“换行”然后再添加一个，它将使用与已删除换行相同的数字。如果您不想要，请告诉我。

// Add Wrap
    $('#addWrap').click(function (e) {
        var $cloneElem = $('#wraper li').last().clone();
        var newID = Number( $cloneElem.find('.wrapId').eq(0).val() ) + 1;
        $cloneElem.find('.wrapId').val(newID);
        $('#wraper').append($cloneElem);
        //adjustContainerHeight(); // commented out for demo
    });


// Delete Wrap
    $('#wraper').on('click','.removeWrap',  function (e) {
        if ($('#wraper .wrap').length == 1) {
            $('#wraper .wrap input:not(.wrapId) ').val(''); // you dont want to set wrapId to '' here, if you did, the next clone would break
            alert('You need to have at least 1 wrap!');
        } 
        else $(this).parent('.wrap').remove();
        e.preventDefault(); // maybe you need this if your clicked element is a link or something? maybe not...
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id="addWrap" type="button" value="Make Clone" />
<ul id="wraper">
    <li class="wrap">
        <input type="text" class="dateField" value="" name="date" />
        <input type="text" class="timeField" value="" name="time" />
        <input type="text" class="wrapId" value="1" name="wrapId" /> <!-- unhidden for demo-->
        <button class="removeWrap" value="" >Remove</button><!-- added for demo-->
    </li>
</ul>

将值+1添加到jquery隐藏克隆字段

1 个答案: