javascript/jquery克隆在下拉列表中不起作用 [英] javascript/jquery clone not working in dropdown list

查看:109
本文介绍了javascript/jquery克隆在下拉列表中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在上一篇文章中问了一个问题,我希望动态生成行,并且应该将数据复制到新行中.它工作正常,但仅适用于文本字段.但是我的表单中也有下拉菜单,并且没有在新行中显示最后一行的选定选项. 这是我的问题 将前一行数据添加到动态生成的行

I asked a question in the last post that i want rows to be dynamically generated and the data should be copied in the new row. it is working fine but only for text fields. but i also have dropdown in my form and it isn't showing the last row's selected options in new row. this was my question add previous row data to dynamically generated row

我有html代码:

<form>
    <table border="1" id="engagements">
        <tr>
            <th>
                <input type="checkbox" onclick="checkAll(this)" />
            </th>
            <th>Organization</th>
            <th>Project</th>
            <th>Product</th>
            <th>Activity</th>
        </tr>
        <tr>
            <td>
                <input type="checkbox" onclick="checkAll(this)" />
            </td>
            <td>
                <select>
                    <option value = "1">One</option>/>
                     <option value = "1">two</option>/>
            </td>
            <td>
                <input type="text" />
            </td>
            <td>
                <input type="text" />
            </td>
            <td>
                <input type="text" />
            </td>
        </tr>
    </table>
    <select name="mode" id="mode">
        <option value="">Add More Rows with Same Data as Above</option>
        <option value="1">1 More</option>
        <option value="2">2 More</option>
        <option value="3">3 More</option>
        <option value="4">4 More</option>
        <option value="5">5 More</option>
    </select>
</form>

和脚本代码:

$("#mode").on('change', function () {
    var rows = parseInt(this.value);
    console.log(rows);
    var lastRow;
    for (var i = 0; i < rows; i++) {
        lastRow = $('#engagements tr').last().clone();
        $('#engagements tr').last().after(lastRow);
    }
});

JS小提琴: http://jsfiddle.net/jW6eL/3/

推荐答案

出于性能原因,jquery在克隆元素时不会保留选择.但是,您可以尝试使用

for performance reasons, jquery doesn't keep selection while making clone of an element. However, you can try using

    .clone(true) 

这将下拉下拉菜单复制所有偶数和数据.这样,您可以使用事件,然后在下拉菜单中选择最后一个选项.

this will copy all evens and data with drop down. this way you may use events and and select last option in the drop down.

这篇关于javascript/jquery克隆在下拉列表中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆