Question

我有一张桌子，我只有一排。我按下Enter按钮时动态生成行。这是我的代码。

   <table>
        <thead>
            <tr>
                <th class="text-center">Amount</th>
                <th class="text-center">Installment</th>
                <th class="text-center">Source of Money</th>
            </tr>
        </thead>
        <tbody>
            <tr class="row1" id="rw1">
                <td class="text-center" id="rw1cl1">
                    <input class="form-control" type="text">
                </td>
                <td class="text-center" id="rw1cl2">
                    <input class="form-control" type="text">
                </td>
                <td class="text-center" id="rw1cl3">
                    <input class="form-control" type="text" id="sm">
                </td>
            </tr>
        </tbody>
    </table>

的JavaScript

        <script type="text/javascript">
            $(document).ready(function() {

                $('#sm').on('keyup', function(e) {

                    var code = (e.keyCode ? e.keyCode : e.which);
                    if (code == 13) {
                        var cloned = $('.row1').first().clone(true);
                        cloned.insertAfter("#rw1");

                    }

                });

            });


        </script>

我按照预期得到了克隆行。但问题是我正在使用已经插入前一行用于制作克隆的文本克隆div。

由于我是JQuery的新手，虽然我对JavaScript很熟悉，但我无法弄清楚如何做到这一点。我尝试了几个stackoverflow答案，但最终没有运气。

请帮我解决这个问题。谢谢！

Answer 1

用于清除克隆上的文本框：

 var cloned = $('.row1').first().clone(true);
 cloned.find('input').val("");

gmo建议

更新：，你不应克隆ID。 ID应该是唯一的。您应该为克隆的TR元素分配新的ID。

 var cloned = $('.row1').first().clone(true);
 cloned.attr('id','rw'+($('tbody tr').length+1))
 cloned.find('input').val("");

Answer 2

var cloned = $('.row1').first().clone(true);
cloned.insertAfter("#rw1").find("input").val("");//instering clone after #rw1 and clearing input fields

DEMO

Answer 3

.clone()中的boolean参数决定是否复制元素数据和事件。请改为var cloned = $('.row1').first().clone();。

Answer 4

   <script type="text/javascript">
        $(document).ready(function() {

            $('#sm').on('keyup', function(e) {

                var code = (e.keyCode ? e.keyCode : e.which);
                if (code == 13) {
                    var cloned = $('.row1').first().clone(true);
                    cloned.find("input").val("").end().insertAfter("#rw1");

                }

            });

        });


    </script>

使用JQuery清除文本字段

4 个答案:

DEMO