Retraso () con error en la reorden de la fila de la tabla

Question

Tengo un script simple para cambiar el pedido de páginas para un CMS. Se basa en reordenar hileras de mesa con jQuery. Ahora el problema es que quiero eliminar la clase destacada de la fila completa con un retraso. Ignora el retraso () y lo elimina de inmediato.

La idea es que cuando pases sobre una fila, le agregará la clase Cell_Rollover. Cuando hace clic en una flecha hacia arriba/hacia abajo, la clase permanece hasta esa fila, mostrándole que la fila se movió. Entonces, después de unos 200 milisegundos, debería eliminar la clase. No lo hace ...

El código para las flechas:

$(".listtable_up, .listtable_down").click(function() {
    var row = $(this).parents("tr:first");
    if ($(this).is(".listtable_up")) {
        row.insertBefore(row.prev());
    } else {
        row.insertAfter(row.next());
    }
    row.delay("200").removeClass('cell_rollover');
});

Nota: La clase Cell_rover se agrega a la fila con un script jQuery:

$(".listtable tbody td").hover(function () {
    $(this).closest('tr').addClass('cell_rollover');
}, function () {
    $(this).closest('tr').removeClass('cell_rollover');
});

¿Por qué sucede esto y cómo solucionarlo?

EDITARLa solución a mi idea general es en forma de efecto JQuery Effect: http://jsfiddle.net/szdre/1/Sin embargo, todavía tratando de averiguar por qué la demora no funciona como debería.

Answer 1

Esto es extremadamente tarde cuando encontré esta publicación buscando algo más.

Si todavía está trabajando en esto y tiene problemas, debe investigar la cola. El RemoveClass no es parte de la cola y debe agregarlo a la cola para que el retraso funcione, de lo contrario simplemente elimina la clase sin esperar el tiempo específico.

$(document.body).click(function () {
  $("div").show("slow");
  $("div").animate({left:'+=200'},2000);
  $("div").queue(function () {
    $(this).addClass("newcolor");
    $(this).dequeue();
  });
  $("div").animate({left:'-=200'},500);
  $("div").queue(function () {
    $(this).removeClass("newcolor");
    $(this).dequeue();
  });
  $("div").slideUp();
});

Este ejemplo tenía más sentido para mí. Espero que eso te ayude, ya que actualmente me estoy moviendo por un problema similar y ya resolví uno como este hace unos minutos :)

Answer 2

El retraso es muy menos cercano a imprudente a los intentos de simple hecho de

.delay(2000)

2000 = 2 seconds

duration: An integer indicating the number of milliseconds to delay execution of
          the next item in the queue.

jquery delay

actualizar

$(".listtable_up, .listtable_down").click(function() {
    var row = $(this).parents("tr:first");
    if ($(this).is(".listtable_up")) {
        row.insertBefore(row.prev()).delay(200).removeClass('cell_rollover');
    } else {
        row.insertAfter(row.next()).delay(200).removeClass('cell_rollover');
    }        
});

Answer 3

Entonces, la idea original, para resaltar la fila que acaba de ser reordenada, se resuelve: http://jsfiddle.net/szdre/1/

El error de retraso aún no ha descubierto.

Answer 4

Logró el comportamiento deseado con window.setInterval()

$element.addClass('cell_rollover');
window.setTimeout(() => $element.removeClass('cell_rollover'), 500);
window.setTimeout(() => $element.addClass('cell_rollover'), 1000);
window.setTimeout(() => $element.removeClass('cell_rollover'), 1500);

Supongo que delay() no funciona porque probablemente uses tablesorter.jquery.js. Si ese es el caso, Tableter tiene un método llamado delay() que anula jQuery delay() método.