頁面無刷新切換實現
阿新 • • 發佈:2017-10-25
替換 att 返回 .ajax www. ava 面包屑 web lis
說明:針對有些後臺為了實現不刷新固定資源,如菜單,會需要局部切換刷新頁面,實現方式如下:
方式一:
$.ajax({ type: ‘post‘, url: webRoot+url, dataType: ‘html‘, success: function(data){ $(‘.page-title‘).html($(obj).find(‘.title‘).text());//頁面頂部標題更新 $(‘.content-header‘).html(header);//面包屑更新 $(‘.content-panel‘).html(data);//主內容替換 } });
註:ajax請求類型為html時,整個頁面會作為數據放到data中,可供js操作放到指定的元素中。
方式二:
$("#body-main-content").load(url, paramedata, function(data, status){ //if(status=="error"){ // $("#body-main-content").html(data);//錯誤提示直接放到頁面 // return false; //} //給頁面設置標題描述等信息 assignPageAttr(); });
註:
load() 方法通過 AJAX 請求從服務器加載數據,並把返回的數據放置到指定的元素中。
註釋:還存在一個名為 load 的 jQuery 事件方法。調用哪個,取決於參數。
語法
load(url,data,function(response,status,xhr))
參數 | 描述 |
---|---|
url | 規定要將請求發送到哪個 URL。 |
data | 可選。規定連同請求發送到服務器的數據。 |
function(response,status,xhr) |
可選。規定當請求完成時運行的函數。 額外的參數:
|
頁面無刷新切換實現