Mui基本簡介
MUI不依賴任何第三方JS庫,壓縮後的JS和CSS文件僅有100+K和60+K
MUI的開發手冊和下載地址
http://dev.dcloud.net.cn/mui/ui/
https://github.com/dcloudio/mui
建議加入該樣式:
.mui-popup{position: fixed;}
Dialog 提示窗
效果類似 alert 、 confirm 、 prompt 、 Msg,樣式與IOS高度相似
//提示警告框alert
document.getElementById("alertBtn").addEventListener('tap', function()
{
mui.alert('歡迎使用Hello MUI', 'Hello MUI', function()
{
info.innerText = '你剛關閉了警告框';
});
});
//確認框confirm
document.getElementById("confirmBtn").addEventListener('tap', function()
{
var btnArray = ['否', '是'];
mui.confirm('MUI是個好框架,確認?', 'Hello MUI', btnArray, function(e)
{
if (e.index == 1)
{
info.innerText = '你剛確認MUI是個好框架';
}
else
{
info.innerText = 'MUI沒有得到你的認可,繼續加油'
}
})
});
//輸入框prompt
document.getElementById("promptBtn").addEventListener('tap', function(e)
{
//修復iOS 8.x平臺存在的bug,使用plus.nativeUI.prompt會造成輸入法閃一下又沒了
e.detail.gesture.preventDefault();
var btnArray = ['取消', '確定'];
mui.prompt('請輸入你對MUI的評語:', '性能好', 'Hello MUI', btnArray, function(e)
{
if (e.index == 1)
{
info.innerText = '謝謝你的評語:' + e.value;
}
else
{
info.innerText = '你點了取消按鈕';
}
})
});
//消息框Msg
document.getElementById("toastBtn").addEventListener('tap', function()
{
mui.toast('歡迎體驗Hello MUI');
});