克隆后无法将输入值设置为空白

时间:2017-05-15 20:30:46

标签: jquery

我被困住了。下面的脚本可以很好地克隆具有多个输入属性的整个div选项卡,但问题是我无法重置/或将值设置为空或null。请帮忙。

<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {

        var inputs = 1;

        $('#btnAdd').click(function(e) {
            e.preventDefault();
            alert("asfter priovent defaulg");

            $('.btnDel:disabled').removeAttr('disabled');
            var c = $('.clonedInput:last').clone(true);

            $.each(c.find(':input'), function (i, val) {
                    var suffix = $(this).attr('name').match(/\d+/);
                    var oldN = $(this).attr('name');

                    var newN = oldN.replace('[' + suffix + ']', '[' + (parseInt(suffix) + 1) + ']');

                    $(this).attr('name', newN);    
                    $(this).find('input').val('').end();

                    c.children(':text').attr('name', newN);
                    c.children(':text').attr('name', newN).val('').end();
            });
            $('.clonedInput:last').after(c);
        });
    });
    </script>
</head>

<form id="myForm">
    <div class="form-horizontal">
        <div class="clonedInput">
            <input type="button" name="btnDelete[1]" class="btnDel" value="Delete" disabled="disabled" /> 
            <div class="row">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label>First</label>
                        <div class="col-md-7">
                            <input type="text" name="firstname[1]" size="10">
                        </div>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label>Second</label>
                        <div class="col-md-7">
                            <input type="text" name="LastName[1]" size="10">
                        </div>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label>Third</label>
                        <div class="col-md-7">
                            <input type="text" name="Status[1]" size="10">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div>
            <input type="button" id="btnAdd" value="add another name" />
        </div>
    </div>
</form>
</html>

1 个答案:

答案 0 :(得分:0)

当您已经在输入中进行迭代时,您正尝试.find()输入。

变化:

$(this).find('input').val('').end();

$(this).val('').end();this.value = '';