【前端】繫結手機號跳轉到“下一步”
阿新 • • 發佈：2018-12-14
前言
小編最近在做專案時遇到一個功能，使用者A在下單買東西時，前提條件有兩個：必須是登陸狀態，必須是有手機號資訊（在微信方式等其他方式登陸時，沒有手機號資訊）。跳轉“繫結手機號頁面”成功之後，需要跳轉到下單的“下一步”。實現思路的難點
一、如何跳轉到下一步
1.頁面上方，新增if判斷是否是跳轉過來的頁面(相當於頁面載入執行的$(document).ready)//判斷是否從繫結手機號返回的頁面 var isJump = GetQueryString('isJump');//從繫結手機頁面傳過來的URL中的引數 if(isJump!=undefined && isJump=='yes') { var bindPhoneParam = sessionStorage.getItem("bindPhoneParam"); //讀取 通過session儲存的引數值 bindPhoneParam = eval('(' + bindPhoneParam + ')');//json字串轉成json物件 buyFood(bindPhoneParam);//下單的方法 }
2.下單的方法，提取出來
// 提取通用的賣品下單方法 function buyFood(newGoodOrder){ Zepto.ajax({ type:"post", url: URL + '/app/sellGoods/createOrder', //建立賣品訂單 data: newGoodOrder, dataType:"json", success:function(data){ // console.log(data); if(data.resultCode == '0'){ var orderId = data.resultData.orderId; // window.location = 'firmGoodsOrder.html?orderNo=' + orderId; window.location = path+'/page?pagePath=mall/sellOrderConfirm&orderNo=' + orderId+'&companyCode='+sessionStorage.movieCode; } else { yh.oAlert(data.resultDesc); } }, error:function(data){ console.log("失敗"+JSON.stringify(data)); } }); }
3.執行ajax方法所需的引數放到session物件中，跳轉回來時，直接執行下單方法
submitFn: function(){ newGoodOrder.goodsInfo = JSON.stringify(goodsPara); sessionStorage.bindPhoneParam = JSON.stringify(newGoodOrder);//繫結手機跳轉頁面需要的引數 //跳轉繫結手機號 var memberPhone=storage.memberPhone; if( memberPhone==null || memberPhone == '' || memberPhone=='undefined'){ yh.oAlert("請先繫結手機號碼"); //將頁面引數傳入地址 var pageName="buyFood"; window.location.href=path + '/page?pagePath=bindPhone/bindPhone&pageName='+pageName; } else { sessionStorage.removeItem("bindPhoneParam"); sessionStorage.removeItem("goodsInfo"); buyFood(newGoodOrder); }
二、json物件的獲取
1.在上面存取session時，我們存進去的是json字串，在讀取的時候，無法獲取值sessionStorage.bindPhoneParam = JSON.stringify(newGoodOrder); //存進去的是json字串
2.獲取json物件裡面的值時，我們需要轉換。
var bindPhoneParam = sessionStorage.getItem("bindPhoneParam");
bindPhoneParam = eval('(' + bindPhoneParam + ')');