jQuery Layer 是一個(gè)基于 jQuery 的彈出層插件,它可以實(shí)現(xiàn)常用的彈出層功能,如提示框、詢問框、加載層、頁面層等,讓我們可以方便地在網(wǎng)頁上創(chuàng)建美觀、實(shí)用的彈出層。
下面我們來看一些 jQuery Layer 的實(shí)例:
// 彈出一個(gè)提示框 layer.msg('Hello World!'); // 彈出一個(gè)詢問框,用戶點(diǎn)擊確定后將執(zhí)行回調(diào)函數(shù) layer.confirm('確定要?jiǎng)h除該記錄嗎?', { btn: ['確定', '取消'] }, function() { // 用戶點(diǎn)擊確定按鈕后執(zhí)行這里的代碼 console.log('Record deleted.'); }); // 彈出一個(gè)加載層,用于異步操作時(shí)的等待提示 var loadingLayer = layer.load(1); // 參數(shù)1表示loading圖標(biāo)的風(fēng)格 $.ajax({ url: '/some/api', success: function() { // 請(qǐng)求成功后,關(guān)閉加載層 layer.close(loadingLayer); // 顯示提示框 layer.msg('操作成功!'); } }); // 彈出一個(gè)頁面層,用于在網(wǎng)頁上顯示一個(gè)自定義的頁面 layer.open({ title: 'jQuery Layer Demo', type: 2, area: ['800px', '600px'], content: '/path/to/custom/page.html' });
上面展示的是一些常用的 jQuery Layer 功能,當(dāng)然還有更豐富、更靈活的用法,我們可以去查閱官方文檔來了解更多的信息。
上一篇bluma vue