mask使用很简单,官网有介绍:
传入显示的文字和停留时间即可:
function showMask(text,time) { $.ui.showMask(text); window.setTimeout(function () { $.ui.hideMask(); }, time); }</span>
由于官网没有提供toast功能,研究了一下,添加几行代码即可:
上面几个文件的#afui_mask { position:absolute;top:45%;z-index:999999; }下面添上
#afui_toast { position:absolute;top:88%;z-index:999999; }
这个js文件
hideMask: function() { $.query("#afui_mask").hide(); },</span>
这个函数下面添加以下几个函数:
/** * Show the toast */ showToast: function(text) { $.query("#afui_toast>h1").html(text); $.query("#afui_toast").show(); }, /** * Hide the toast */ hideToast: function() { $.query("#afui_toast").hide(); },
(别忘记{后面的,否则不能用)
//setup ajax mask this.addContentDiv("afui_ajax", ""); var maskDiv = $.create("div", { id: "afui_mask", className: "ui-loader", html: "<span class='ui-icon ui-icon-loading spin'></span><h1>Loading Content</h1>" }).css({ "z-index": 20000, display: "none" }); document.body.appendChild(maskDiv.get(0));
这个js下面加入:
//toast var toastDiv = $.create("div", { id: "afui_toast", className: "ui-loader", html: "</span><h1>Loading Content</h1>" }).css({ "z-index": 20000, display: "none" }); document.body.appendChild(toastDiv.get(0));
到此为止就可以像mask一样的使用toast了,下面是效果图:
function showToast(text,time) { $.ui.showToast(text); window.setTimeout(function () { $.ui.hideToast(); }, time); }
appframework学习--mask toast
时间: 2024-10-22 20:11:25