jq、js獲取一個頁面中的ajax資料,傳到另一個頁面顯示(通過url傳參方式)
做專案遇到了頁面之間傳輸資料的問題,特別是第一個頁面的資料是使用ajax顯示的,當點選ajax中append的li的時候,開啟另一個頁面,將第一個頁面的資料顯示在另一個頁面上,具體情況如下:
一、這是第一個頁面中的js程式碼:
//顯示所有該使用者的歌單
function showMusicMenu(){
var uid = $(".user").attr("id");//獲取頁面該行的id
$.ajax({
url: 'mm/getAllMusicMenuByUid.do?uid='+uid,
type:'post',
async: false,//設定為同步
dataType:'json',
success:function (r) {
var mlist = r.mmlist;
for (var i = 0; i < mlist.length; i++) {
var time = timestampToTime(mlist[i].mm_time.time);
//迴圈顯示相應的音單
$(".mmenu").append("<li id='"+mlist[i].mm_id+"'
"<img src='img/index/lazy_load.png' alt='"+mlist[i].mm_name+"' title='"+mlist[i].mm_name+"'/>"+
"<div class='menuname'>"+mlist[i].mm_name+"</div>"+
"<span class='jianjie' style='display:none;'>"+mlist[i].mm_summary+"</span>"+
"<span class='ctime' style='display:none;'>"+time+"</span>"+
"</li>");
}
getmmimgBymm_id();//顯示所有該使用者的歌單上最新封面
}
});
}
單擊li後實現跳轉
function jump(e){
//取到該li的資料
var mmid = $(e).attr("id");
var img = $(e).find("img").attr("src");
var name = $(e).find("img").attr("title");
var time = $(e).find("span").eq(1).html();
var jianjie = $(e).find("span").eq(0).html();
//將資料拼接到這個頁面的url中進行傳參,跳轉頁面
location.href='music_menu.jsp?mmid='+mmid+'&img=' + encodeURI(img)+'&name=' + encodeURI(name)+'&time=' + encodeURI(time)+'&jianjie=' + encodeURI(jianjie);
}
二、這是第二個頁面的js資料,即跳轉之後的頁面資料
//獲取url中的引數,這是一個獲取url引數的方法
function GetRequest(){
var url = location.search; //獲取url中"?"符後的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
//擷取&後迴圈
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]); //decodeURI()解決中文亂碼
}
}
return theRequest;
}
然後,通過上面那個方法,獲取引數,並顯示在頁面上
//顯示歌單列表
function showList(){
var request = new Object();
request = GetRequest(); //取到傳過來的資料
var mmid = request['mmid']; //歌單id
var img = request['img']; //圖片地址
var name = request['name']; //歌單名稱
var time = request['time']; //建立時間
var jianjie = request['jianjie']; //簡介
//顯示歌單資訊
$(".music1_left a .m_1").attr("src",img);
$(".music1_left ul li").eq(0).html(name);
$(".music1_left ul li").eq(2).append(time);
$(".music1_left ul li").eq(4).append(jianjie);
}
結束:這個方法雖然能顯示資料出來,但是引數過多,url位址列中就會有很長的一串引數顯示,誰有更好的方法,那麻煩大家多多關照~