jQuery頁(yè)面刷新(局部、全部)問(wèn)題分析
本文實(shí)例分兩部分對(duì)jquery刷新問(wèn)題進(jìn)行介紹，第一部分介紹了呢頁(yè)面局部刷新；第二部分介紹了頁(yè)面全部刷新
第一：頁(yè)面局部刷新
jQuery對(duì)Ajax操作進(jìn)行了封裝，在jQuery中$.ajax()方法屬于最底層的方法，第2層是laod()、$.get()和$.post()方法，第3層是$.getScript()和$.getJSON()方法。
重點(diǎn)分析load()方法通常用來(lái)從Web服務(wù)器上獲取靜態(tài)的數(shù)據(jù)文件.要傳遞一些參數(shù)給服務(wù)器中的頁(yè)面，那么可以使用$.get()或者$.post()方法$.ajax方法
load() Code
//無(wú)參數(shù)傳遞，則是GET方式
$("#resText").load("test.php",function(){
//......
});
//有參數(shù)傳遞，則是POST方式
$("#resText").load("test.php",{name:"xht555",age:"24"},function(){
//......
});
簡(jiǎn)單說(shuō)一下 post 與get 區(qū)別：
get：用get方式可傳送簡(jiǎn)單數(shù)據(jù)（即：瀏覽器將各個(gè)表單字段元素及其數(shù)據(jù)按照URL參數(shù)的格式附加在url后面），但大小一般限制在1KB下；被客戶端的瀏覽器緩存起來(lái)，不安全。
post：覽器把各表單字段元素及其數(shù)據(jù)作為HTTP消息的實(shí)體內(nèi)容發(fā)送給Web服務(wù)器，而不是作為URL地址的參數(shù)進(jìn)行傳遞，
總結(jié)：
一：GET方式傳送數(shù)據(jù)量小，處理效率高，安全性低，會(huì)被緩存，而POST反之?！?/strong>
二：AJAX亂碼問(wèn)題
產(chǎn)生亂碼的原因:
1、xtmlhttp 返回的數(shù)據(jù)默認(rèn)的字符編碼是utf-8，如果客戶端頁(yè)面是gb2312或者其它編碼數(shù)據(jù)就會(huì)產(chǎn)生亂碼
2、post方法提交數(shù)據(jù)默認(rèn)的字符編碼是utf-8，如果服務(wù)器端是gb2312或其他編碼數(shù)據(jù)就會(huì)產(chǎn)生亂碼
解決辦法有：
1、若客戶端是gb2312編碼，則在服務(wù)器指定輸出流編碼
2、服務(wù)器端和客戶端都使用utf-8編碼
gb2312:header('Content-Type:text/html;charset=GB2312');
utf8:header('Content-Type:text/html;charset=utf-8');
注 意:如果你已經(jīng)按上面的方法做了，還是返回亂碼的話,檢查你的方式是否為get,對(duì)于get請(qǐng)求（或凡涉及到url傳遞參數(shù)的），被傳遞的參數(shù)都要先經(jīng) encodeURIComponent方法處理.如果沒(méi)有用encodeURIComponent處理的話,也會(huì)產(chǎn)生亂碼
$.post() Code
//$.post()方式：
$('#test_post').click(function (){
$.post(
'ajax_json.php',
{
username:$('#input1').val(),
age:$('#input2').val(),
sex:$('#input3').val(),
job:$('#input4').val()
},
function (data) //回傳函數(shù)
{
var myjson='';
eval('myjson=' + data + ';');
$('#result').html("姓名:" + myjson.username + "<br/>工作:" + myjson['job']);
}
);
});
$.get() Code
//$.get()方式：
$('#test_get').click(function ()
{
$.get(
'ajax_json.php',
{
username:$("#input1").val(),
age:$("#input2").val(),
sex:$("#input3").val(),
job:$("#input4").val()
},
function(data) //回傳函數(shù)
{
var myjson='';
eval("myjson=" + data + ";");
$('#result').html("姓名:" + myjson.username + "<br/>工作:" + myjson['job']);
}
);
});
});
$.getJson(”Default.php”, {id:”1″, page: “2″ },
function(data){
//注意，這里返回的JSON數(shù)據(jù)格式，不同于xml.
});
第二：頁(yè)面全部刷新
- 1 window.location.reload()刷新當(dāng)前頁(yè)面.
- 2 parent.location.reload()刷新父親對(duì)象（用于框架）
- 3 opener.location.reload()刷新父窗口對(duì)象（用于單開(kāi)窗口）
- 4 top.location.reload()刷新最頂端對(duì)象（用于多開(kāi)窗口）
以上就是本文的詳細(xì)內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助。
相關(guān)文章
Jquery操作radio,checkbox,select表單操作實(shí)現(xiàn)代碼
Jquery操作radio,checkbox,select表單操作實(shí)現(xiàn)代碼，需要用jquery操作表單的朋友可以參考下。2010-04-04
在jquery的ajax中如果我們希望實(shí)現(xiàn)同步或者異步我們可以直接設(shè)置async發(fā)生為真或假即可true false，下面舉幾個(gè)jquery ajax同步和異步實(shí)例2013-11-11
任意輸入國(guó)家和城市，用“，”分隔，點(diǎn)擊設(shè)置下面的超鏈接就變?yōu)榱藙傇O(shè)置的城市，點(diǎn)擊可以跳到這個(gè)城市的查看地圖頁(yè)，鼠標(biāo)移到超鏈接上會(huì)彈出一個(gè)350*350的地圖2013-05-05
Jquery的擴(kuò)展方法extend是我們?cè)趯?xiě)插件的過(guò)程中常用的方法，該方法有一些重載原型，在此，我們一起去了解了解2012-02-02
通過(guò)添加 CSS 類(lèi)改變?cè)氐耐庥^和感覺(jué)，非常干凈的方法，而不是添加內(nèi)聯(lián)樣式。2011-08-08
jQuery.Form實(shí)現(xiàn)Ajax上傳文件同時(shí)設(shè)置headers的方法
這篇文章主要介紹了jQuery.Form實(shí)現(xiàn)Ajax上傳文件同時(shí)設(shè)置headers的方法，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2017-06-06
jQuery點(diǎn)擊tr實(shí)現(xiàn)checkbox選中的方法
jQuery點(diǎn)擊tr實(shí)現(xiàn)checkbox選中的方法，需要的朋友可以參考一下2013-03-03
jQuery+jsp下拉框聯(lián)動(dòng)獲取本地?cái)?shù)據(jù)的方法(附源碼)
這篇文章主要介紹了jQuery+jsp下拉框聯(lián)動(dòng)獲取本地?cái)?shù)據(jù)的方法,以實(shí)例形式較為詳細(xì)的分析了jQuery結(jié)合jsp實(shí)現(xiàn)下拉聯(lián)動(dòng)菜單讀取本地?cái)?shù)據(jù)的相關(guān)技巧,并附帶了完整源碼供讀者下載參考,需要的朋友可以參考下2015-12-12
jQuery實(shí)現(xiàn)ajax無(wú)刷新分頁(yè)頁(yè)碼控件
這篇文章主要介紹了jQuery實(shí)現(xiàn)ajax無(wú)刷新分頁(yè)頁(yè)碼控件,需要的朋友可以參考下2017-02-02
jQuery實(shí)現(xiàn)的導(dǎo)航條點(diǎn)擊后高亮顯示功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的導(dǎo)航條點(diǎn)擊后高亮顯示功能,涉及jQuery事件響應(yīng)及頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-03-03