1

私はこのコードを持っています:

$("#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");**
});

クラスの追加と削除の間のコードには3秒かかりますが、新しいクラスの変更は見られません...クラスの追加と削除は両方とも内部コードの後に​​実行されるようです。

4

1 に答える 1

2

ブラウザの再描画呼び出しに関係している可能性があります。

ブラウザーが一度に 1 つのタスクしか実行しないことは既にご存じかもしれませんが、これは、JavaScript を実行するか、UI を更新する (ブラウザーを再描画する) ことを意味します。

この場合、スレッドはスクリプトの実行でビジーであるため、追加されたクラス情報で UI を再描画する時間がない場合があります。

私が提案できる解決策の 1 つは、タイムアウトを使用して、以下に示すように、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 に答える