3

我正在尝试从每个列表 row 中克隆最后一个元素。我可以克隆行（在这种情况下我需要克隆第一个元素），但我不能span从每个li. 这是我到目前为止所拥有的：

HTML：

<ul class="elements">
    <li>
        <span>Span 1</span>
        <span>Span 2</span>
        <span>Span 3</span>
    </li>
    <li>
        <span>Span 4</span>
        <span>Span 5</span>
        <span>Span 6</span>
    </li>
</ul>
<a href="#" class="new_row">Add new row</a>
<a href="#" class="new_column">Add new column</a>

查询： 

$('.new_row').click( function(e) {
    e.preventDefault();
    var ul = $(this).prev('.elements');

    var new_data= $("li", ul).eq(0).clone();
    new_data.appendTo(ul);
});
$('.new_column').click( function(e) {
    e.preventDefault();
    $('li').each(function(){
        $('span:last').clone();
    });
});

JSFiddle：http: //jsfiddle.net/vPDpH/

我将不胜感激任何帮助。预先感谢。

4

2 回答 2

5

您正在克隆元素但没有对它做任何事情..

您还需要在当前 li 的上下文中克隆最后一个跨度。否则它将克隆 HTML 中的最后一个跨度，而不管它在哪里

$('.new_row').click( function(e) {
    e.preventDefault();
    var ul = $(this).prev('.elements');

    var new_data= $("li", ul).eq(0).clone();
    new_data.appendTo(ul);
});
$('.new_column').click( function(e) {
    e.preventDefault();
    $('li').each(function(){
       var new_data= $('span:last', this).clone();
        new_data.appendTo(this);
    });
});

检查小提琴

于 2013-07-06T11:58:56.730 回答
1

替代

Javascript

$(".new_row").click(function (e) {
    e.preventDefault();
    var elements = $(e.target).siblings(".elements").first();

    elements.append($("li", elements).first().clone());
});

$(".new_column").click(function (e) {
    e.preventDefault();
    $("li", $(e.target).siblings(".elements").first()).each(function (index, element) {
        $(element).append($("span", element).last().clone());
    });
});

在jsfiddle 上

于 2013-07-06T12:29:15.987 回答