如何编写JavaScript函数以克隆表中的行？

Question

我在div标签中有这样的表格：

<div id="listDiv" class="row-fluid">
            <div class="col-12">
                <div class="widget-box">
                    <div class="widget-content nopadding">
                        <table id="myDataTable" class="table">
                            <thead>
                                <tr>
                                    <th>CLCode</th>
                                    <th>QSerial</th>
                                    <th>QGroup</th>
                                    <th>Question</th>
                                    <th>Description</th>
                                    <th>AnswerType</th>
                                    <th>ManualEntry</th>
                                    <th>ScriptName</th>
                                    <th>ParameterString</th>
                                    <th>ValidFrom</th>
                                    <th>ValidTill</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody id="listBody">
                                @foreach (var item in Model)
                                {
                                    <tr id="@item.RowId" onchange="addRowHandlers(@item.RowId)">
                                        <td id="[email protected]">@item.CLCode</td>
                                        <td id="[email protected]">@item.QSerial</td>
                                        <td><input style="max-width:100px;" type="text" id="[email protected]" placeholder="QGroup" required="required" value="@item.QGroup" /></td>
                                        <td><input style="max-width:100px;" type="text" id="[email protected]" placeholder="Question" required="required" value="@item.Question" /></td>
                                        <td><textarea style="max-width:110px;" type="text" id="[email protected]" placeholder="Description" required="required">@item.Description</textarea></td>
                                        @* <td>@item.SelectedAnswerType</td>*@
                                        <td>
                                            @*Answer*@

                                            @Html.DropDownList("AnswerType", new SelectList(ViewBag.AnswerTypes, @item.AnswerType), "Select Any", new { id = "answerType-" + @item.RowId + "", style = "max-width:100px;" })

                                        </td>
                                        <td><input type="checkbox" id="[email protected]" checked="@item.ManualEntry" /></td>
                                        <td><textarea style="max-width:110px;" type="text" id="[email protected]" placeholder="ScriptName">@item.ScriptName</textarea></td>
                                        <td><textarea style="max-width:110px;" type="text" id="[email protected]" placeholder="ScriptName">@item.ParameterString</textarea></td>
                                        <td><input style="max-width:140px;" type="date" id="[email protected]" [email protected] /></td>
                                        <td><input style="max-width:140px;" type="date" id="[email protected]" [email protected] /></td>
                                        <td>
                                            @Html.ActionLink("Edit","EditRow",new {id=item.CLCode }) |
                                            @Html.ActionLink("Delete","DeleteRow",new {id=item.CLCode })                                           
                                        </td>
                                    </tr>
                                }
                            </tbody>
                        </table>
                    </div>
                </div>

然后在不同的标签中有一个按钮：

@ 添加新问卷的按钮 @

            <div style="float:left;margin-left:28px;">
                <input type="button" id="buttonForNewRow" class="btn btn-success" data-dismiss="modal" onclick="addNewRowForQuestionnaire()" value="Add New Questionnaire" />
            </div>

此按钮应该使用空的文本框和单击的下拉列表来克隆上一行。

我写的jQuery函数是

function addNewRowForQuestionnaire()
    {
        //var clCode = document.getElementById('clCode').value;
        var $tr = $(this).find('#listDiv').find('#myDataTable').find('#listBody').closest('TR');

        var $clone=$tr.clone();
        $clone.find(':text').val('');
        $tr.after($clone);
    }

以某种方式未获得此功能。

我不知道为什么功能正确或不正确。