1. 程式人生 > 實用技巧 >jquery 提示資訊

jquery 提示資訊

// 提示資訊
// 使用 ShowTip("請輸入要搜尋的處理機構!", 'info');
function ShowTip(tip, type) {
    var $tip = $('#tip');
    if ($tip.length == 0) {
    // 設定樣式,也可以定義在css檔案中
        $tip = $('<span id="tip" style="transform:translate(-50%,-50%);position:fixed;top:50%;left: 50%;z-index:9999;height:28px; padding: 2px 16px;line-height: 28px;color:#fff;background:rgba(0,0,0,0.7);font-size:12px;border-radius:4px;"></span>');
        $(
'body').append($tip); } $tip.stop(true).prop('class', 'alert alert-' + type).text(tip).fadeIn(500).delay(1000).fadeOut(500); } // 正在載入中 //loading.ShowLoading(); 顯示 loading.CloseLoading();隱藏 var loading={ loadingHtml:'<div class="loading" style="display: flex;align-items: center; transform:translate(-50%,-50%);position:fixed;top:50%;left: 50%;z-index:9999;height:28px; padding: 2px 16px;line-height: 28px;color:#fff;background:rgba(0,0,0,0.7);font-size:12px;border-radius:4px;"><img style="width: 14px;height: 14px;margin-right: 6px;" src="img/loading.gif" />正在載入中</div>', ShowLoading:
function(){ $('body').append(loading.loadingHtml); }, CloseLoading:function(){ $('body .loading').remove(); } }

// 提示資訊// 使用 ShowTip("請輸入要搜尋的處理機構!", 'info');function ShowTip(tip, type) { var $tip = $('#tip'); if ($tip.length == 0) { // 設定樣式,也可以定義在css檔案中 $tip = $('<span id="tip" style="transform:translate(-50%,-50%);position:fixed;top:50%;left: 50%;z-index:9999;height:28px; padding: 2px 16px;line-height: 28px;color:#fff;background:rgba(0,0,0,0.7);font-size:12px;border-radius:4px;"></span>'); $('body').append($tip); } $tip.stop(true).prop('class', 'alert alert-' + type).text(tip).fadeIn(500).delay(1000).fadeOut(500);}



// 正在載入中//loading.ShowLoading(); 顯示 loading.CloseLoading();隱藏var loading={loadingHtml:'<div class="loading" style="display: flex;align-items: center; transform:translate(-50%,-50%);position:fixed;top:50%;left: 50%;z-index:9999;height:28px; padding: 2px 16px;line-height: 28px;color:#fff;background:rgba(0,0,0,0.7);font-size:12px;border-radius:4px;"><img style="width: 14px;height: 14px;margin-right: 6px;" src="img/loading.gif" />正在載入中</div>',ShowLoading:function(){$('body').append(loading.loadingHtml);},CloseLoading:function(){$('body .loading').remove();}}