jQuery頁面刷新(局部、全部)問題分析
本文實(shí)例分兩部分對(duì)jquery刷新問題進(jìn)行介紹,第一部分介紹了呢頁面局部刷新;第二部分介紹了頁面全部刷新
第一:頁面局部刷新
jQuery對(duì)Ajax操作進(jìn)行了封裝,在jQuery中$.ajax()方法屬于最底層的方法,第2層是laod()、$.get()和$.post()方法,第3層是$.getScript()和$.getJSON()方法。
重點(diǎn)分析load()方法通常用來從Web服務(wù)器上獲取靜態(tài)的數(shù)據(jù)文件.要傳遞一些參數(shù)給服務(wù)器中的頁面,那么可以使用$.get()或者$.post()方法$.ajax方法
load() Code
//無參數(shù)傳遞,則是GET方式
$("#resText").load("test.php",function(){
//......
});
//有參數(shù)傳遞,則是POST方式
$("#resText").load("test.php",{name:"xht555",age:"24"},function(){
//......
});
簡(jiǎn)單說一下 post 與get 區(qū)別:
get:用get方式可傳送簡(jiǎn)單數(shù)據(jù)(即:瀏覽器將各個(gè)表單字段元素及其數(shù)據(jù)按照URL參數(shù)的格式附加在url后面),但大小一般限制在1KB下;被客戶端的瀏覽器緩存起來,不安全。
post:覽器把各表單字段元素及其數(shù)據(jù)作為HTTP消息的實(shí)體內(nèi)容發(fā)送給Web服務(wù)器,而不是作為URL地址的參數(shù)進(jìn)行傳遞,
總結(jié):
一:GET方式傳送數(shù)據(jù)量小,處理效率高,安全性低,會(huì)被緩存,而POST反之?!?/strong>
二:AJAX亂碼問題
產(chǎn)生亂碼的原因:
1、xtmlhttp 返回的數(shù)據(jù)默認(rèn)的字符編碼是utf-8,如果客戶端頁面是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方法處理.如果沒有用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.
});
第二:頁面全部刷新
- 1 window.location.reload()刷新當(dāng)前頁面.
- 2 parent.location.reload()刷新父親對(duì)象(用于框架)
- 3 opener.location.reload()刷新父窗口對(duì)象(用于單開窗口)
- 4 top.location.reload()刷新最頂端對(duì)象(用于多開窗口)
以上就是本文的詳細(xì)內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助。
相關(guān)文章
用Jquery實(shí)現(xiàn)滾動(dòng)新聞
此文主要用Jquery實(shí)現(xiàn)滾動(dòng)新聞,Jquery的強(qiáng)大功能,幾行代碼即可實(shí)現(xiàn),需要的朋友可以參考下2014-02-02
JQuery使用屬性addClass、removeClass和toggleClass實(shí)現(xiàn)增加和刪除類操作示例
這篇文章主要介紹了JQuery使用屬性addClass、removeClass和toggleClass實(shí)現(xiàn)增加和刪除類操作,涉及jquery事件響應(yīng)及頁面元素屬性動(dòng)態(tài)操作相關(guān)使用技巧,需要的朋友可以參考下2019-11-11
JQuery獲取樣式中的background-color顏色值的問題
用JQuery獲取樣式中的background-color的值時(shí)發(fā)現(xiàn)在獲取到的顏色值在IE中與Chrome、Firefox顯示的格式不一樣,經(jīng)搜索找到了下段代碼可解決此問題,感興趣的朋友可以參考下2013-08-08
仿新浪微博返回頂部的jquery實(shí)現(xiàn)代碼
在web頁面中,如果頁面較高,為了方便用戶快速地返回頂部,都會(huì)添加一個(gè)返回頂部按鈕2012-10-10
Jquery和Js獲得元素標(biāo)簽名稱的方法總結(jié)
下面小編就為大家?guī)硪黄狫query和Js獲得元素標(biāo)簽名稱的方法總結(jié)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10
jQuery自動(dòng)完成插件completer附源碼下載
這篇文章主要介紹了jQuery自動(dòng)完成插件completer的相關(guān)資料,需要的朋友可以參考下2016-01-01
jQuery選擇器中含有空格的使用示例及注意事項(xiàng)
選擇器中的空格是不容忽視的,多一個(gè)空格或少一個(gè)空格也許得到的結(jié)果會(huì)截然不同的,下面以一個(gè)示例為大家詳細(xì)介紹下到底有什么不同,感興趣的朋友額可以參考下2013-08-08
jquery實(shí)現(xiàn)異步文件上傳ajaxfileupload.js
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)異步文件上傳ajaxfileupload.js,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-10-10

