jQuery触发点击事件似乎是落后一步

Question

我正在使用很棒的tablesorter插件。我必须克隆原始标题，然后重新插入可滚动区域上方的克隆。

要在隐藏的旧表头元素上触发tablesorter插件，当用户单击可见克隆表时，我正在隐藏表上使用.trigger()触发点击。

这里是jQuery的：

$('.w_price_assess').delegate('#quotations_clone thead th', 'click', function() { 

     var $cloneTh = $(this); 
     var $cloneThIndex = $cloneTh.index('#quotations_clone thead th'); 

     $('#quotations thead th:eq(' + $cloneThIndex + ')').trigger('click'); 

     var $classList =$('#quotations thead th:eq(' + $cloneThIndex + ')').attr('class').split(/\s+/);    

     console.log($classList); 

     $.each($classList, function(index, item){ 
      if (item==='headerSortDown') { 
       $('#quotations_clone thead th').removeClass('headerSortUp headerSortDown'); 
       $('#quotations_clone thead th:eq(' + $cloneThIndex + ')').addClass('headerSortDown'); 
      } else if (item==='headerSortUp') { 
       $('#quotations_clone thead th').removeClass('headerSortUp headerSortDown'); 
       $('#quotations_clone thead th:eq(' + $cloneThIndex + ')').addClass('headerSortUp'); 
      } else { 
       //$('#quotations_clone thead th').removeClass('headerSortUp headerSortDown'); 
      } 
     });  

    }); 

正在发生的问题是，当我第一次点击克隆个元素并不立即带回台分拣机追加到隐藏个元素的类。

我需要它在同一时间注册，我不知道如何去解决它？

Answer 1

我设法通过使用一个全局变量，像这样来解决这个问题：

var $orginalHead = $("#tablesorter-demo thead"); 

    globalIndex = null; 

    $($orginalHead) 
    .clone() 
    .insertBefore("#tablesorter-demo") 
    .wrap('<table id="sorter-clone" />'); 

    $("body").delegate("#sorter-clone thead th", "click", function() { 
     var $tHeader = $(this); 
     $tHeaderIndex = $tHeader.index("#sorter-clone thead th"); 
     $('#tablesorter-demo thead th:eq(' + $tHeaderIndex + ')').trigger('click'); 
    }); 

    $("#tablesorter-demo").bind("sortEnd", function() { 
     var $classList = $('#tablesorter-demo thead th:eq(' + $tHeaderIndex + ')').attr('class').split(/\s+/); 
     replaceClasses($classList, $tHeaderIndex, globalIndex);     
    }); 

    function replaceClasses(classes, index, oldIndex) { 

     globalIndex = index; 
     var list = classes.toString().replace(",", " "); 
     var oldHead = $("#sorter-clone thead th:eq(" + oldIndex + ")").removeAttr("class"); 
     var newHead = $("#sorter-clone thead th:eq(" + index + ")").removeAttr("class").addClass(list);   

     if (oldIndex !== null) { 
      return {x:oldHead, y:newHead}; 
     } else { 
      console.log("bar"); 
     } 
    }