Modal zuerst in JS anzeigen, bevor andere Funktionen ausgeführt werden

Question

Ich habe eine Frage und habe mich gefragt, ob ich etwas falsch mache.

Ich habe eine Seite, die fast 200 div ist.

Also, wenn ich die Funktion ausführen, verbirgt es im Grunde alle 200 Divs zuerst und zeigt dann bestimmte divs. Dies geschieht bereits. aber da es alle 200 divs zuerst und dann 10-15 divs [basierend auf operator logic] versteckt, dauert es 5-7 Sekunden.

Ich wollte ein Popup-modal anzeigen, sobald die Funktion startet, dann das Looping von divs, um sie auszublenden .. und dann die Funktion, um die divs anzuzeigen, die angezeigt werden müssen und schließlich die pop- up modal.

Aber wenn ich die Funktion ausführen, kommt das Modal kaum, da es darauf wartet, dass die ganze Schleife endet.

Ich verwende die folgenden:

function show_by_price() 
{ 
    $('#loading').modal('show'); 

    for(j=1; j<= $("#total_div_count").val(); j++) 
    { 
     $("#div_id_"+j).hide() 
    } 

    $('#loading').modal('hide'); 
} 

Answer 1

Ich kann nicht das Problem mit dem modalen verstehen, aber ich habe eine andere Frage -

Warum Sie nicht über 2 divs, einen Hauptbehälter für alle 200 Elemente und ein weiterer "Hilfe" -Behälter. Also, wenn Sie das Verstecken tun müssen - Sie verstecken den Hauptbehälter, anstatt 200 Elemente einzeln zu verstecken und dann die gewünschten 10-15 Elemente zu bewegen, die in dem zweiten Hilfebehälter angezeigt werden sollten, der sichtbar ist?

Dies sollte viel leistungsfähiger sein.

Answer 2

Tun Sie dies nicht mit JavaScript, es gibt eine viel effizientere Möglichkeit, Elemente wie von Samuil vorgeschlagen/zu verbergen. Davon abgesehen könnten Sie daran interessiert sein, etwas zu tun, das auf bootstrap modal events basiert.

$('#loading').on('shown.bs.modal',function() { 
    //execute code in here after the modal is fully visible 
}).modal('show');