jQuery用clone替换div

时间:2014-11-11 13:13:31

标签: jquery

我正在尝试创建一个小的js脚本,它将用克隆值替换td的值。

我做了一个小提琴,以便更清楚。

我想单击表格的“更多”按钮,然后将“更多”替换为克隆的“123”。 我希望Less成为最后一篇文章的最后一篇文章,但我稍后会对此进行研究。

jQuery(document).ready(function($) {

  $('table').each(function(){
    var $table = $(this);
    var n = $(this).find( "tr:nth-child(4) td:visible" ).length;
    var c = $(this).find('tr:nth-child(3)').last().find('td:last').clone();
    $(this).find('tr:nth-child(3)').last().find('td:last').html(
      "<a href='javascript:void(0)' class='more-countries-big'>More</a>"
      );
    var x = $( "<a href='javascript:void(0)' class='more-countries-big'>More</a>");
    x.on('click', function(){
        $table.find('tr:nth-child(3)').last().find('td:last').html(c.html());
    });
  });
  $("table").each(function(){
    var $tr = $(this).find('tr');
    $tr.hide();
    $tr.eq(0).show();
    $tr.eq(1).show();
    $tr.eq(2).show();
  });

    $('a.more-countries-big').on('click',function(){
        var txt = $(".open-continents").is(':visible') ? 'More' : 'Less';
        $(this).parents('table').find('tbody tr').toggleClass('open-continents');
        $(this).parents('table').find('a.more-countries-big').text(txt);
    });

});

Fiddle Example

谢谢

1 个答案:

答案 0 :(得分:0)

您的解决方案在这里: 你可以这样使用:

    $('a.more-countries-big').on('click',function(){
        if($(this).hasClass('less')) {
            $(this).removeClass("less");
            $(this).text("More");
            $(this).parents("table").find("tr:last").remove();
        } else {
            var tds = $(this).parents("table").find("tr:last").html();
            $(this).parents("table").append("<tr>"+tds+"</tr>");
            $(this).addClass("less");
            $(this).text("Less");
        }
     })

如果要添加更多列,请使用不同的链接和受尊重的事件。