Jquery: stop everything that happens immediately

I am just learning jquery and it took me a long time to browse the jQuery api site to create these few lines of code. What I want to do is use ajax to load content from another page and put it in an existing div. currently the code is working, but when I click on the link, all the steps are performed at a time, so it performs the load () function when the div #content slides up ...

What I want to do is each line step by step, so after completing one line of THEN, the next line starts (for example, the #content div slides and then the things inside #content are deleted, but now the #content div becomes empty before how he finishes the slide)

$(document).ready(function(){ $("#nav a").click(function(event){ event.preventDefault(); $("#content").slideUp(); $("#content").empty(); var navlink = $(this).attr("href"); $("#content").load(navlink + " " + "#content"); $("#content").slideDown(); }) }); 
+4
source share
3 answers

Use callback options:

 $(document).ready(function(){ $("#nav a").click(function(event){ event.preventDefault(); $("#content").slideUp("normal", function() { $("#content").empty() .load($(this).attr("href") + " " + "#content") .slideDown(); //Just so this won't wrap here, can be one line }); }); }); 
+3
source

most jquery functions accept callbacks.

+2
source

you need to use the ajax method callback in jquery. in particular, the callback method, which is executed when the page is loading, or the onsuccess method, which is executed when the page being loaded is displayed without errors. this means that crawl will occur only after loading the page

+2
source

Source: https://habr.com/ru/post/1299817/


All Articles