• jQuery Callback Functions

    jQuery Callback Functions

    A callback functions are executed after the current effect is finished. JavaScript statements are executed line by line. However, with effects, the next line of code can be run even though the effect is not finished. This can create errors. To prevent this, we can create a callback function.

    For Example,

    The below has a callback parameter that is a function that will be executed after the hide effect is completed:

    <!–jQuery Code to Hide/Show Image–><script>

    $(document).ready(function(){

    $(“form”).submit(function(event){

    event.preventDefault();

    if($(“#btnEffect”).val()==”Hide”){

    $(“#divImage1”).hide(3000,function(){

    alert(“The Image is now hidden”);

    });

    $(“#btnEffect”).val(“Show”);

    }

    else{

    $(“#divImage1”).show(3000);

    $(“#btnEffect”).val(“Hide”);

    }

    });

    });

    </script>

    The example below has no callback parameter, and the alert box will be displayed before the hide effect is completed:

    <!–jQuery Code to Hide/Show Image–><script>

    $(document).ready(function(){

    $(“form”).submit(function(event){

    event.preventDefault();

    if($(“#btnEffect”).val()==”Hide”){

    $(“#divImage1”).hide(3000);

    alert(“The Image is now hidden”);

    $(“#btnEffect”).val(“Show”);

    }

    else{

    $(“#divImage1”).show(3000);

    $(“#btnEffect”).val(“Hide”);

    }

    });

    });

    </script>

    Appreciate my work :Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInPin on PinterestShare on RedditShare on StumbleUponShare on TumblrDigg thisShare on YummlyShare on VKFlattr the authorBuffer this page

Leave a Reply

Your email address will not be published. Required fields are marked *