jq之deferred方法

<html>

<script src="./jQuery-min-v3.3.1.js"></script>



<body>



    <h1 class="click-me">测试jq的$.Deferred()方法</h1>

    <p>摘抄于：https://www.cnblogs.com/guoyansi19900907/p/5000267.html</p>

</body>

<script>

    (function () {

        //目标：先执行when中的方法，再执行done/fail中的内容

        //1、

        // function delayOne () {

        //  setTimeout (function () {

        //      console.log('执行啦');

        //  }, 2000)

        // }

        // $.when( delayOne () ).done( function () {

        //  console.log('o---yes');

        // }).fail( function () {

        //  console.log("o---no");

        // })

        //先执行 'o---yes'； 2s后执行 '执行啦'



        //2、

        // var dfd = $.Deferred();

        // function delayTwo (dfd) {

        //  var flag = true;

        //  setTimeout (function () {

        //      console.log('执行啦');

        //      if (flag) {

        //          dfd.resolve ('yes')

        //      } else {

        //          dfd.reject ('no')

        //      }

        //  }, 2000)

        //  return dfd

        // }

        // $.when( delayTwo (dfd) ).done( function (value) {

        //  console.log('o---yes-->',value);

        // }).fail( function () {

        //  console.log("o---no--->",value);

        // })

        // '执行啦' 'o---yes--> yes'

        //3、

        // var dfd = $.Deferred(); //全局变量

        // function delayTwo (dfd) {

        //  var flag = true;

        //  setTimeout (function () {

        //      console.log('执行啦');

        //      if (flag) {

        //          dfd.resolve ('yes')

        //      } else {

        //          dfd.reject ('no')

        //      }

        //  }, 2000)

        //  return dfd

        // }

        // $.when( delayTwo (dfd) ).done( function (value) {

        //  console.log('o---yes-->',value);

        // }).fail( function () {

        //  console.log("o---no--->",value);

        // })

        // dfd.resolve('捣乱的。。。');

        //resolve直接执行done方法；reject直接执行fail方法

        // 'o---yes--> 捣乱的。。。' ; 2s后执行 '执行啦'

        //4、

        // function delayTwo () {

        //  var dfd = $.Deferred(); //局部变量

        //  var flag = true;

        //  setTimeout (function () {

        //      console.log('执行啦');

        //      if (flag) {

        //          dfd.resolve ('yes')

        //      } else {

        //          dfd.reject ('no')

        //      }

        //  }, 2000)

        //  return dfd

        // }

        // $.when( delayTwo () ).done( function (value) {

        //  console.log('o---yes-->',value);

        // }).fail( function () {

        //  console.log("o---no--->",value);

        // })

        // '执行啦' 'o---yes--> yes'

        //5、

        // function delay() {

        //  var dfd = $.Deferred();

        //  var bool = true;

        //  setTimeout(function () {

        //      console.log("delay的setTimeout执行啦!");

        //      if (bool) {

        //          dfd.resolve("done");

        //      } else {

        //          dfd.reject("fail");

        //      }

        //  }, 2000);

        //  return dfd;

        // }

        // var delay2 = delay();

        // delay2.resolve();

        // $.when(delay()).done(function (value) {

        //  console.log('o---yes-->',value);

        // }).fail(function (value) {

        //  console.log("o---no--->",value);

        // });

        //2s后执行： delay的setTimeout执行啦! delay的setTimeout执行啦! o---yes--> done

        //6、

        // function delay() {

        //  var dfd = $.Deferred();

        //  var bool = true;

        //  setTimeout(function () {

        //      console.log("delay的setTimeout执行啦!");

        //      if (bool) {

        //          dfd.resolve("done");

        //      } else {

        //          dfd.reject("fail");

        //      }

        //  }, 2000);

        //  return dfd.promise ();

        // }

        // var delay2 = delay();

        // delay2.resolve();

        // $.when(delay()).done(function (value) {

        //  console.log('o---yes-->',value);

        // }).fail(function (value) {

        //  console.log("o---no--->",value);

        // });

        //报错

        //7、更改

        function delay(time) {

            return $.Deferred (function (dfd) {

                setTimeout ( function () {

                    console.log('setTimeout执行了');

                    dfd.resolve()

                }, time)

            })

        }

        delay (3000).done( function () {

            console.log('done');

        })

    })()

</script>



</html>