1

I have this code:

$("#add_city").click(function() {   
    **$("#gif_loader").addClass("overlay");**
    var oTT = TableTools.fnGetInstance( 'tab_citta' );
    var aSelectedTrs = oTT.fnGetSelected();
    var totAdded = 0;
    $.each(aSelectedTrs, function(i, item) {
        totAdded = totAdded + $(this).children().eq(1).html() * 1;
        addRowAddedCity($(this).children().eq(0).html(),
                        "<span class='val_or right' style='text-align:right;'>"+$(this).children().eq(1).html()+"</span>",
                        "<input type='text' class='new_val right' value='" + $(this).children().eq(1).html() + "' />");         
        var pos = oTableAddedCity.fnGetPosition($(this).get(0));
        oTableCity.fnDeleteRow(pos);            
    });         
    oTT.fnSelectNone();
    $('#tot_city_sel').html( $('#tot_city_sel').html() * 1 + totAdded );
    **$("#gif_loader").removeClass("overlay");**
});

The code between add and remove class take 3 seconds but I don't see the new class change ... It seems like the add and remove class are both executed after the inside code.

4

1 回答 1

2

它可能与浏览器重绘调用有关。

您可能已经知道浏览器一次只会执行一项任务，这意味着它将执行 javascript 或刷新 ui（重新绘制浏览器）。

在这种情况下，由于线程正忙于执行脚本，它可能没有时间用添加的类信息重新绘制 ui。

我可以建议的一种可能的解决方案是使用超时来为浏览器提供足够的呼吸空间来更新 ui，如下所示

$("#add_city").click(function() {   
    $("#gif_loader").addClass("overlay");
    setTimeout(function(){
        var oTT = TableTools.fnGetInstance( 'tab_citta' );
        var aSelectedTrs = oTT.fnGetSelected();
        var totAdded = 0;
        $.each(aSelectedTrs, function(i, item) {
            totAdded = totAdded + $(this).children().eq(1).html() * 1;
            addRowAddedCity($(this).children().eq(0).html(),
                            "<span class='val_or right' style='text-align:right;'>"+$(this).children().eq(1).html()+"</span>",
                            "<input type='text' class='new_val right' value='" + $(this).children().eq(1).html() + "' />");         
            var pos = oTableAddedCity.fnGetPosition($(this).get(0));
            oTableCity.fnDeleteRow(pos);            
        });         
        oTT.fnSelectNone();
        $('#tot_city_sel').html( $('#tot_city_sel').html() * 1 + totAdded );
        $("#gif_loader").removeClass("overlay");
    })
});
于 2013-05-10T08:11:57.463 回答