deferred.done()

jQuery

previous page next page

deferred.done()

Categories: Deferred Object

deferred.done( doneCallbacks [, doneCallbacks ] ) Returns: Deferred

Description: Add handlers to be called when the Deferred object is resolved.

  • version added: 1.5deferred.done( doneCallbacks [, doneCallbacks ] )

    • doneCallbacks
      Type: Function()
      A function, or array of functions, that are called when the Deferred is resolved.
    • doneCallbacks
      Type: Function()
      Optional additional functions, or arrays of functions, that are called when the Deferred is resolved.

The deferred.done() method accepts one or more arguments, all of which can be either a single function or an array of functions. When the Deferred is resolved, the doneCallbacks are called. Callbacks are executed in the order they were added. Since deferred.done() returns the deferred object, other methods of the deferred object can be chained to this one, including additional .done() methods. When the Deferred is resolved, doneCallbacks are executed using the arguments provided to the resolve or resolveWith method call in the order they were added. For more information, see the documentation for Deferred object.

Examples:

Example: Since the jQuery.get method returns a jqXHR object, which is derived from a Deferred object, we can attach a success callback using the .done() method.

1
2
3
 
                                  

                                    

                                      $.get("test.php").done(function() {
                                    

                                  

                                  

                                    

                                        alert("$.get succeeded");
                                    

                                  

                                  

                                    

                                      });

Example: Resolve a Deferred object when the user clicks a button, triggering a number of callback functions:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
                                  

                                    

                                      
                                        <!DOCTYPE html>
                                      
                                    

                                  

                                  

                                    

                                      
                                        <html>
                                      
                                    

                                  

                                  

                                    

                                      
                                        <head>
                                      
                                    

                                  

                                  

                                    

                                        <script src="http://code.jquery.com/jquery-latest.js"></script>
                                    

                                  

                                  

                                    

                                      
                                        </head>
                                      
                                    

                                  

                                  

                                    

                                      
                                        <body>
                                      
                                    

                                  

                                  

                                    

                                       
                                    

                                  

                                  

                                    

                                       <button>Go</button>
                                    

                                  

                                  

                                    

                                       <p>Ready...</p>
                                    

                                  

                                  

                                    

                                       
                                    

                                  

                                  

                                    

                                      
                                        <script>
                                        
                                      
                                    

                                  

                                  

                                    

                                      
                                        /* 3 functions to call when the Deferred object is resolved */
                                      
                                    

                                  

                                  

                                    

                                      
                                        function fn1() {
                                      
                                    

                                  

                                  

                                    

                                        $("p").append(" 1 ");
                                    

                                  

                                  

                                    

                                      }
                                    

                                  

                                  

                                    

                                      
                                        function fn2() {
                                      
                                    

                                  

                                  

                                    

                                        $("p").append(" 2 ");
                                    

                                  

                                  

                                    

                                      }
                                    

                                  

                                  

                                    

                                      
                                        function fn3(n) {
                                      
                                    

                                  

                                  

                                    

                                        $("p").append(n + " 3 " + n);
                                    

                                  

                                  

                                    

                                      }
                                    

                                  

                                  

                                    

                                       
                                    

                                  

                                  

                                    

                                      
                                        /* create a deferred object */
                                      
                                    

                                  

                                  

                                    

                                      var dfd = $.Deferred();
                                    

                                  

                                  

                                    

                                       
                                    

                                  

                                  

                                    

                                      
                                        /* add handlers to be called when dfd is resolved */
                                      
                                    

                                  

                                  

                                    

                                      dfd
                                    

                                  

                                  

                                    

                                      
                                        /* .done() can take any number of functions or arrays of functions */
                                      
                                    

                                  

                                  

                                    

                                      .done( [fn1, fn2], fn3, [fn2, fn1] )
                                    

                                  

                                  

                                    

                                      
                                        /* we can chain done methods, too */
                                      
                                    

                                  

                                  

                                    

                                      .done(function(n) {
                                    

                                  

                                  

                                    

                                        $("p").append(n + " we're done.");
                                    

                                  

                                  

                                    

                                      });
                                    

                                  

                                  

                                    

                                       
                                    

                                  

                                  

                                    

                                      
                                        /* resolve the Deferred object when the button is clicked */
                                      
                                    

                                  

                                  

                                    

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

                                  

                                  

                                    

                                        dfd.resolve("and");
                                    

                                  

                                  

                                    

                                      });
                                    

                                  

                                  

                                    

                                      
                                        </script>
                                      
                                    

                                  

                                  

                                    

                                       
                                    

                                  

                                  

                                    

                                      
                                        </body>
                                      
                                    

                                  

                                  

                                    

                                      
                                        </html>
 POWERED BYHERONOTE
previous page start next page