Jquey里的同步请求和异步请求

时间：2021-06-08 23:56:39

1.同步请求 发送了同步请求后  会一直等待 先执行 alert("result:" + d); temp = d;   在执行alert("this is last:"+temp);  不能操作页面上的其他内容，会造成当前UI线程阻塞

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <meta charset="utf-8" />

    <script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"> </script>

    <script type="text/javascript">

        $(function () {

            $.ajaxSetup({

                async: false

            });

            var temp = 0;

            $("#a1").click(function () {

                $.post("home/test", { async: false }, function (d) { alert("result:" + d); temp = d; });

                alert("this is last:"+temp);

            })

        })

    </script>

</head>

<body>

    <a id="a1"> this is a1</a>

    <p>dddddddddddddddddddddddddddddddddddddddddd</p>

    <input type="button" value="btn" />

</body>

</html>

2.异步请求，发送完异步请求后    先执行 alert("this is last:"+temp);再执行 alert("result:" + d); temp = d;     能够操作浏览器的其他内容，不会造成当前UI线程阻塞

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <meta charset="utf-8" />

    <script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"> </script>

    <script type="text/javascript">

        $(function () {

            $.ajaxSetup({

                async: true

            });

            var temp = 0;

            $("#a1").click(function () {

                $.post("home/test",  function (d) { alert("result:" + d); temp = d; });

                alert("this is last:"+temp);

            })

        })

    </script>

</head>

<body>

    <a id="a1"> this is a1</a>

    <p>dddddddddddddddddddddddddddddddddddddddddd</p>

    <input type="button" value="btn" />

</body>

</html>

异步／同步 是得到消息的方式。  同步方式一直等待结果，而异步方式是回调（或其他方式通知）通知结果
阻塞／非阻塞是否当前UI线程能做其他事情 。当前线程一直等待不能做其他事情就造成阻塞，当前线程做其他事情 就不会造成阻塞

相关文章