zoukankan      html  css  js  c++  java
  • jquery ajax属性async(同步异步)

    在jquery的ajax中如果我们希望实现同步或者异步时我们可以直接设置async属性为false和true

    同步执行

    当把async设为false时,这时ajax的请求时同步的
    也就是说,这个时候ajax块发出请求后,他会等待在load()这个地方,不会去执行after() 直到load()部分执行完毕

    前台

    <script src="//cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
    <script>
        function load(msg) {
            console.log(msg);
        }
        function after(){
            console.log('after');
        }
        $.ajax({
            url: '/ajax',
            method: 'GET',
            async: false
        }).success(function(result){
            load(result);
        });
        after();
    </script>
    

    后台

    var http = require('http');
    var fs = require('fs');
    http.createServer(function(req,res){
        if(req.url == '/sync'){
            fs.createReadStream('sync.html').pipe(res);
        }else if(req.url == '/ajax'){
            setTimeout(function(){
                res.end('ok');
            },5000);
        }else{
            res.end('Not Found');
        }
    }).listen(8080);
    

    异步执行

    在这里,async默认的设置值为true,这种情况为异步方式
    就是说当ajax发送请求后,在等待server端返回的这个过程中,前台会继续执行ajax块后面的脚本,直到server端返回正确的结果才会去执行success 也就是说这时候执行的是两个线程,ajax块发出请求后一个线程和ajax块后面的脚本(另一个线程)

    前台

    <script src="//cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
    <script>
        function load(msg) {
            console.log(msg);
        }
        function after(){
            console.log('after');
        }
        $.ajax({
            url: '/ajax',
            method: 'GET',
            async: true
        }).success(function(result){
            load(result);
        });
        after();
    </script>
    

    后台

    var http = require('http');
    var fs = require('fs');
    http.createServer(function(req,res){
        if(req.url == '/sync'){
            fs.createReadStream('sync.html').pipe(res);
        }else if(req.url == '/async'){
            fs.createReadStream('async.html').pipe(res);
        } else if(req.url == '/ajax'){
            setTimeout(function(){
                res.end('ok');
            },5000);
        }else{
            res.end('Not Found');
        }
    }).listen(8080);
    
  • 相关阅读:
    洛谷 P2807 三角形计数
    洛谷 P1727 计算π
    洛谷 P1595 信封问题
    洛谷 P3131 [USACO16JAN]子共七Subsequences Summing to Sevens
    3.1、spark集群运行应用
    移动端自适应
    【Flex布局】
    【pm2】
    【安全】
    【Bower】
  • 原文地址:https://www.cnblogs.com/heson/p/10015844.html
Copyright © 2011-2022 走看看