weUI应用之JS常用信息提示弹层的封装(2)

//标题提醒文字弹层 function dialog(title , msg , callback){ var dialog1 , dialog2; dialog1 = '\ <div>\ <div></div>\ <div>\ <div><strong>'+ title +'</strong></div>\ <div>' + msg + '</div>\ <div>\ <a href="javascript:;">取消</a>\ <a href="javascript:;">确定</a>\ </div>\ </div>\ </div>\ '; dialog2 = '\ <div>\ <div></div>\ <div>\ <div><strong>'+ title +'</strong></div>\ <div>' + msg + '</div>\ <div>\ <a href="javascript:;">确定</a>\ </div>\ </div>\ </div>\ '; if(arguments[2]){ $('body').append(dialog1); $('#dialog1').fadeIn('fast'); $('#dialog1 .primary').on('click',function(){ callback(); }); $('#dialog1 .default').on('click',function(){ $('#dialog1').fadeOut('fast',function(){ $('#dialog1').remove(); }); }); }else{ if(!$('#dialog2').length){ $('body').append(dialog2); }else{ $('#dialog2 .weui_dialog_title').html(title); $('#dialog2 .weui_dialog_bd').html(msg); } $('#dialog2').fadeIn('fast'); $('#dialog2 .primary').on('click',function(){ $('#dialog2').fadeOut('fast'); }); } } //完成提示弹层 function toast(){ var msg; arguments[0] ? msg = arguments[0] : msg = '已完成' ; var toast; toast = '\ <div>\ <div></div>\ <div>\ <i></i>\ <p>' + msg + '</p>\ </div>\ </div>\ '; if(!$('#toast').length){ $('body').append(toast); }else{ $('#toast .weui_toast_content').html(msg); } $('#toast').fadeIn('fast',function(){ setTimeout(function(){$('#toast').fadeOut('fast');},800); }); } //加载提示弹层 function loadingToast(){ var msg; arguments[0] ? msg = arguments[0] : msg = '数据加载中' ; var loadingToast; loadingToast = '\ <div>\ <div></div>\ <div>\ <div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ <div></div>\ </div>\ <p>' + msg + '</p>\ </div>\ </div>\ '; if(!$('#loadingToast').length){ $('body').append(loadingToast); }else{ $('#loadingToast .weui_toast_content').html(msg); } $('#loadingToast').fadeIn('fast'); } //菜单项弹层 function actionSheetMenu(){ if(!arguments.length){ return; } var menuHtml = ''; for(i=0;i<arguments.length;i++){ if(typeof(arguments[i]) != 'object' || !arguments[i].id || !arguments[i].text){ continue; } menuHtml += '<div>' + arguments[i].text + '</div>'; } if(!menuHtml){ return; } var actionSheetMenu; actionSheetMenu = '\ <div>\ <div></div>\ <div>\ <div>\ </div>\ <div>\ <div>取消</div>\ </div>\ </div>\ </div>\ '; if(!$('#actionSheet_wrap').length){ $('body').append(actionSheetMenu); } $('.weui_actionsheet_menu').html(menuHtml); $('#mask').show().addClass('weui_fade_toggle'); $('#weui_actionsheet').addClass('weui_actionsheet_toggle'); $('#mask').unbind('transitionend').unbind('webkitTransitionEnd'); $('#mask , #actionsheet_cancel').on('click',function(){ $('#mask').removeClass('weui_fade_toggle'); $('#weui_actionsheet').removeClass('weui_actionsheet_toggle'); $('#mask').on('transitionend webkitTransitionEnd',function(e){ $('#mask').hide(); }); }); } //吐司提示 function textToast(text){ if(!$('#textToast').length){ $('body').append('<div></div>') } $('#textToast').text(text).addClass('textToastShow').on('animationend webkitAnimationEnd',function(e){ $(this).removeClass('textToastShow'); }); }