一artDialog中的time参数,是用来表示几秒钟之后关闭对话框。
但是在用的时候发现一个问题
<!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>
在弹出对话框之后,程序不能继续执行。
在解决办法就是将后续的程序放在close() 函数中执行。
<!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>
问题得到解决
二,ajax中的请求有异步和同步之分。
ajax中的请求有异步和同步之分,在默认的请求中async默认为true,如果要设置为同步请求,修改为false。
在工作中,做一个预约抢购活动。业务逻辑是,在预约阶段,如何用户已预约,将展示预约码,不展示“立即预约”按钮。
但是问题是,在后面的程序中 预约码变量 order_num 总是为null。
经过调试,发现是因为获取预约码的ajax请求是异步方式,后续代码是执行时接口并未获得预约码的值,因此,一直报错。
代码片段:
/*查询预约码*/ $.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); }
解决方法是:将异步修改成同步,但是因为是跨域请求,数据格式是jsonp。不能同步。有一个好方法,将业务逻辑放在请求成功中执行
/*查询预约码*/
$.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();/*抢购活动结束*/
}
}
});
这样,不管请求有多慢,都不会取不到值,而出错。