JS回調函數(callback)


在使用Jquery的時候,用到Callback(),回調函數的概念。而且很多。

比如:
$.ajax({
    url:"test.json",
    type: "GET",
    data: {username:$("#username").val()},
    dataType: "json",
    beforSend:function(){ 
         // 禁用按鈕防止重復提交
        $("#submit").attr({ disabled: "disabled" });
    }, 
    complete:function(msg){ 
        //請求完成后調用的回調函數(請求成功或失敗時均調用)
    } , 
    error:function(msg){ 
        //請求失敗時被調用的函數 
    } , 
    Sucess:function(msg){ 
        //請求成功后調用的回調函數 
    } 
});

 

回調函數大家都會用,只是Jquery封裝了之后,不能讓大家明白回調函數的真正使用。
JS Api 里這樣解釋: A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.
當然我們可以在JS當中來真正嘗試一下回調函數的神奇。
如果你直接在函數a里調用的話,那么這個回調函數就被限制死了。但是使用函數做參數就有下面的好處:當你a(b)的時候函數b就成了回調函數,而你還可以a(c)這個時候,函數c就成了回調函數。如果你寫成了function a(){...;b();}就失去了變量的靈活性。下面是代碼:
 
<!DOCTYPE HTML> 
<html> 
<head>  
<meta charset="GBK" />
<title>回調函數(callback)</title> 
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.9.0/jquery.min.js"></script>
<script language="javascript" type="text/javascript"> 
    var f;
    function d(){
        alert("我是Jquery定義的函數d");
    }
    var e = function(){
        alert("我也是Jquery定義的函數e");
    }
    
    function a(callback) {    
        alert("我是parent函數a!");   
        d(); 
        if (typeof callback === "function"){
            //alert(callback);
            callback(); 
        }
    } 
    function b(){ 
        alert("我是回調函數b");  
      
        d();
        e();
        f();
    } 
    function c(){ 
        alert("我是回調函數c");   
        d();
        e();
        f();
    } 
    function test1() { 
        a(b); 
    } 
    function test2() { 
        a(c); 
    } 
    $(function(){ 
        f = function(){ 
            alert("我是回調函數f");   
        } 
    });
</script> 
</head> 
<body > 
    <h1>學習js回調函數</h1> 
    <button onClick=test1()>test a(b)</button> 
    <button onClick=test2()>test a(c)</button> 
    <p>應該能看到調用了兩個回調函數</p> 
    <p > </p> 
</body> 
</html> 

網上看了一個例子,進行了修改,按上面方式可以回調成功,直接復制粘貼到html文件中即可測試

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM