jQuery Callback Functions (Explained With Examples)

After the current effect has completed 100%, a callback function is called.

Line by line, JavaScript statements are executed. However, even if the product isn't finished, it can achieve the following line of code with effects. This can lead to mistakes.

You can avoid this by writing a callback function.

After the current effect has finished, a callback function is called.

Syntax for callback functions in jQuery

$(selector).hide(speed,callback);

Examples of jQuery callback function

The callback parameter in the example below is a function that will execute after the hiding effect is complete:

• Example with Callback

$("button").click(function(){
  $("p").hide("slow", function(){
    alert("The paragraph is now hidden");
  });
});

Because there is no callback parameter in the example below, the alert box will appear before the hide effect is complete:

• Example without Callback

$("button").click(function(){
  $("p").hide(1000);
  alert("The paragraph is now hidden");
});