首页 > 其他 > 详细

artDialog中的time参数,ajax请求中的异步与同步

时间:2014-03-31 11:36:33      阅读:1077      评论:0      收藏:0      [点我收藏+]

一artDialog中的time参数,是用来表示几秒钟之后关闭对话框。

但是在用的时候发现一个问题

bubuko.com,布布扣
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="http://s.hqbcdn.com/favicon/favicon.ico" />
<title>artdialog中的time属性</title>
<meta name=‘keywords‘ content=""/>
<meta name=‘description‘ content=""/>
<meta name="viewport" content="width=device-width,maximum-scale=2.0, user-scalable=yes" />
<link rel="stylesheet" type="text/css" href="artDialog/dialog.css" />
<script src="jquery/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="artDialog/artDialog.js"></script>
</head> <body> <input type="button" value="click me" id="test_button" /> <script type="text/javascript"> $(function(){ $(#test_button).click( function(){ art.dialog({ id : "", title : ‘‘, content : 我将在3秒后消失,消失后继续执行程序, width : 300, height : 200, margin : 0, padding : 0, time : 2 }) }); art.dialog({ id : "", title : ‘‘, content : 我是继续执行的程序, width : 300, height : 200, margin : 0, padding : 0, time : 2 }) }) </script> </body> </html>
bubuko.com,布布扣

在弹出对话框之后,程序不能继续执行。

在解决办法就是将后续的程序放在close() 函数中执行。

bubuko.com,布布扣
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="http://s.hqbcdn.com/favicon/favicon.ico" />
<title>artdialog中的time属性</title>
<meta name=‘keywords‘ content=""/>
<meta name=‘description‘ content=""/>
<meta name="viewport" content="width=device-width,maximum-scale=2.0, user-scalable=yes" />
<link rel="stylesheet" type="text/css" href="artDialog/dialog.css" />
<script src="jquery/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="artDialog/artDialog.js"></script>
</head>
<body>
<input type="button" value="click me" id="test_button" /> 
<script type="text/javascript">
$(function(){
    $(#test_button).click(
        function(){
            art.dialog({
                id : "",
                title : ‘‘,
                content : 我将在3秒后消失,消失后继续执行程序,
                width : 300,
                height : 200,
                margin : 0,
                padding : 0,
                time : 2,
               close: function(){
                   art.dialog({
                      id : "",
                title : ‘‘,
                content : 我是继续执行的程序,
                width : 300,
                height : 200,
                margin : 0,
                padding : 0,
            })    
              }    
            })    
    });   
})
</script>
</body>
</html>                        
bubuko.com,布布扣

问题得到解决

二,ajax中的请求有异步和同步之分。

ajax中的请求有异步和同步之分,在默认的请求中async默认为true,如果要设置为同步请求,修改为false。

在工作中,做一个预约抢购活动。业务逻辑是,在预约阶段,如何用户已预约,将展示预约码,不展示“立即预约”按钮。

但是问题是,在后面的程序中 预约码变量 order_num 总是为null。

经过调试,发现是因为获取预约码的ajax请求是异步方式,后续代码是执行时接口并未获得预约码的值,因此,一直报错。

代码片段:

bubuko.com,布布扣
   /*查询预约码*/
    $.ajax({
        url : "http://www.okhqb.com/item/getMemberBookingCode.json?eventId=581",
        type : "GET",
        dataType : ‘jsonp‘,
        jsonp : ‘callback‘,
        success : function (result) {
            if( result.code == 200 ){
                    order_num = result.data;
                    
            }
        }
    });

    /*预约中*/
    if( order_end > currentime  ){    
         initOrder();
    }else if(  currentime > order_end && kq_time > currentime ){
         initWait();/*等待开抢*/
    }else if(  currentime > kq_time && act_end > currentime ){
         initQiang();/*抢购开始*/
    }else if(currentime > act_end) {
          initEnd();/*抢购活动结束*/
    }

    /*初始化预约状态*/
    function initOrder(){
        /*处理状态*/        
        $(‘#process_line‘).addClass(‘process_line1‘);
        $(‘#node1‘).addClass(‘node1_ok‘);
        $(‘#node2‘).addClass(‘node2_no‘);
        $(‘#node3‘).addClass(‘node3_no‘);
        $(‘.note_text1‘).addClass(‘curr‘);
        if( !order_num){
                      $(‘#btn_state‘).removeClass().addClass(‘order_btn‘);
                 }else{
            var _html = ‘<p class="order_num">您的预约码是:<span id="order_num">‘+ order_num +‘</span></p>‘;
           $(‘.login_hm‘).before(_html);
                }

        cc = setInterval(_countLeave, 1000);
    }
bubuko.com,布布扣


解决方法是:将异步修改成同步,但是因为是跨域请求,数据格式是jsonp。不能同步。有一个好方法,将业务逻辑放在请求成功中执行

bubuko.com,布布扣
/*查询预约码*/
    $.ajax({
        url : "http://www.okhqb.com/item/getMemberBookingCode.json?eventId=581",
        type : "GET",
        dataType : ‘jsonp‘,
        jsonp : ‘callback‘,
        success : function (result) {
            if( result.code == 200 ){
                    order_num = result.data;
                    
            }
            /*预约中*/
            if( order_end > currentime  ){    
                initOrder();
            }else if(  currentime > order_end && kq_time > currentime ){
                initWait();/*等待开抢*/
            }else if(  currentime > kq_time && act_end > currentime ){
                initQiang();/*抢购开始*/
            }else if(currentime > act_end) {
                initEnd();/*抢购活动结束*/
            }
        }
    });
bubuko.com,布布扣

这样,不管请求有多慢,都不会取不到值,而出错。

artDialog中的time参数,ajax请求中的异步与同步,布布扣,bubuko.com

artDialog中的time参数,ajax请求中的异步与同步

原文:http://www.cnblogs.com/huanhuan8808/p/3633923.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!