快捷導(dǎo)航

jQuery 回調(diào)函數(shù)（callback）的使用和基礎(chǔ)

更新時(shí)間：2015年02月26日 11:01:35 投稿：hebedich

這篇文章主要介紹了jQuery 回調(diào)函數(shù)（callback）的使用和基礎(chǔ),需要的朋友可以參考下

還是先貼代碼吧

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script src="js/jquery.js"></script>

    </head>

<style>

body{font-family: "微軟雅黑";width: 980px; margin: 0 auto; text-align: center;}

    .box{

        width: 300px;

        height: 300px;

        background: green;

        border: 1px solid #e6e6e6;

        margintop: 50px;

        line-height: 200px;

        position: absolute;

    }

button{

    border: none;

    background: green;    

    width: 100px;

    height: 50px;

    line-height: 50px;

    color: #fff;

    font-size: 16px;

    margin-top: 50px;

    }

</style>

    <body>

        <button>點(diǎn)擊開(kāi)始動(dòng)畫(huà)</button>

        <div class="box" ></div>

        <script> 

            $(document).ready(function(){

              $("button").click(function(){

                var div=$(".box");

                div.animate({height:'200px',opacity:'0.4'},"slow");

                div.animate({width:'200px',opacity:'0.8'},"slow");

                div.animate({height:'100px',opacity:'0.4'},"slow");

                div.animate({width:'100px',opacity:'0.8'},"slow");

                div.animate({right:'100px',opacity:'0.8'},"slow");

                div.animate({bottom:'100px',opacity:'0.8'},"slow");

                div.animate({left:'100px',opacity:'0.8'},"slow");

                div.animate({top:'100px',opacity:'0.8'},"slow",function(){

                    alert("The paragraph is over");

                });

              });

            });

        </script> 

        <script>

            $(document).ready(function(){

                $("button").click(function(){

                    var div=$(".box");

                        div.animate({height:'300px',opacity:'0.4'},"slow");

                        div.animate({width:'300px',opacity:'0.8'},"slow");

                        div.animate({height:'100px',opacity:'0.4'},"slow");

                        div.animate({width:'100px',opacity:'0.8'},"slow",function(){

                    alert("The paragraph is over");

              　　　　  });

                    });

                });

            });

        </script>

    </body>

</html>

所謂的回調(diào)函數(shù)，其實(shí)就是在 speed 或 duration 參數(shù)可以設(shè)置許多不同的值，比如 "slow", "fast", "normal" 或毫秒后面再添加函數(shù)，顯示相對(duì)應(yīng)的內(nèi)容，以提示網(wǎng)民

小伙伴們對(duì)jQuery回調(diào)函數(shù)是否有了新的認(rèn)識(shí)了呢，希望本文能給大家一些幫助。

您可能感興趣的文章: