jQuery, запускающий событие click, похоже, работает на один шаг позади - PullRequest
Новая
       12

jQuery, запускающий событие click, похоже, работает на один шаг позади

0 голосов
/ 14 октября 2010

Я использую плагин 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');
            }
        });    

    });

Проблема заключается в том, что когда я впервые щелкаю по клонированному элементу th, он не сразу возвращает класс, который сортировщик таблиц добавляет к скрытому элементу th.

Мне нужно, чтобы он регистрировался одновременно, и я не уверен, как это сделать?

1 Ответ

0 голосов
/ 19 октября 2010

Мне удалось решить эту проблему с помощью глобальной переменной, например: 

    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");
        }
    }
...