1

我在表之间移动行,它似乎工作正常,但是一旦该行在另一个表中,与该行相关的所有 javascript 函数都不再工作,我不知道为什么。

javascript非常简单,我将html作为行并将其移动到另一个表中。

如果您单击子选项卡,它们工作正常,但单击候补名单(或批准移至上表)将其移至下表,该行的选项卡不再工作。

奇怪的是没有抛出错误,控制台中也没有记录任何内容。

http://jsfiddle.net/Ha3Jq/16/

jQuery

$( ".enrolled-participants" ).on("click","button.remove-participant",function(){
    if($(this).hasClass('remove-participant')) 
    {
       $(this).html('Approve');
       $(this).removeClass('remove-participant').addClass('add-participant');
       var className = $(this).closest('tr').attr('class');
       var childClass =$(this).closest('tr').next().attr('class');
       var current_row = $(this).closest('tr').html();
       var child_row = $(this).closest('tr').next().html();
         $(this).closest('tr').next().remove();
         $(this).closest('tr').remove();
         $('.waitlisted > tbody:last').append('<tr class="'+className+'">'+current_row+'</tr><tr class="'+childClass+'">'+child_row+'</tr>');
     }

我也在使用表格排序器插件。

分拣机

    $(".enrolled-participants,.waitlisted")
        .tablesorter({
            theme : 'blue',
            // this is the default setting
            cssChildRow: "tablesorter-childRow",

            // initialize zebra and filter widgets
            widgets: ["zebra", "filter"],

            widgetOptions: {
                // include child row content while filtering, if true
                filter_childRows  : true,
                // class name applied to filter row and each input
                filter_cssFilter  : 'tablesorter-filter',
                // search from beginning
                filter_startsWith : false,
                // Set this option to false to make the searches case sensitive 
                filter_ignoreCase : true
            }

        });

    // hide child rows
    //$('.tablesorter-childRow td').hide();

    // Toggle child row content (td), not hiding the row since we are using rowspan
    // Using delegate because the pager plugin rebuilds the table after each page change
    // "delegate" works in jQuery 1.4.2+; use "live" back to v1.3; for older jQuery - SOL
    $('.tablesorter').delegate('.toggle', 'click' ,function(){
//alert('ok');
        // use "nextUntil" to toggle multiple child rows
        // toggle table cells instead of the row
        $(this).closest('tr').nextUntil('tr:not(.tablesorter-childRow)').find('td').toggle();

        return false;
    });

    // Toggle widgetFilterChildRows option
    $('button.toggle-option').click(function(){
        var c = $('.tablesorter')[0].config.widgetOptions,
        o = !c.filter_childRows;
        c.filter_childRows = o;
        $('.state').html(o.toString());
        // update filter; include false parameter to force a new search
        $('input.tablesorter-filter').trigger('search', false);
        return false;
    });
4

1 回答 1

3

使用detach而不是remove.

remove将其从 DOM 中移除,并移除所有 (JavaScript) 事件侦听器。

detach简单地将其从 DOM 中移除;事件侦听器保持不变。

于 2013-10-31T07:15:31.633 回答