jQuery选择不适用于克隆行

NewUser 发表于 Dev

新的用户

这是我的HTML：

<table>
        <tr>
            <th>Names</th>
            <th>Product Names</th>
        </tr>
        <tr class="data-wrapper">
            <td>
                <select class="form-control required chosen-select-width name" name="source_language[][0]" aria-required="true">
                    <option value="name1">Name 1</option>
                    <option value="name2">Name 2</option>
                    <option value="name3">Name 3</option>
                    <option value="name4">Name 4</option>
                    <option value="name5">Name 5</option>
                </select>
            </td>
            <td><input type="text" name="product-names"></td>
        </tr>
    </table>
    <button type="button" class="btn add-new-data"> Add </button>

在这里，我已使用jQuery选择的下拉菜单。我正在克隆行。但是，克隆后所选的选择不起作用。这是我在jsFiddle上的代码。

如何为克隆的元素选择工作？

克劳迪奥·雷迪（Claudio Redi）

您应该先克隆，然后再应用，chosen以便克隆的元素是“免费选择的”。

jQuery(function($){ 
    var clone = $("table tr.data-wrapper:first").clone(true);
    $('select.name').chosen({width: "100%"});
    $('body').on('click', '.add-new-data', function() {
        var ParentRow = $("table tr.data-wrapper").last();
        clone.clone(true).insertAfter(ParentRow);
        $('tr.data-wrapper:last select').chosen();
    });
});

演示

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。