前端頁面間傳值之cookie傳值和url傳值

大家好，我是小C：

我們在做一些網站需要傳值交互，最近我就遇到了這問題，如果用H5的本地存儲，IE8以下是不能支持的，但是官方說到IE8及以上就支持，但是某些版本還是存在問題。所以我們來看看下面兩種方法吧！

第一種方法：url傳值（就像可以通過超鏈接的href屬性傳值是一樣的）

舉例：

var Id = "1";
var name = "lili";
window.location.href = 'two.html?userId=' +Id + "&name=" + name;

那么在two.html中該怎么接收數據呢

function getQueryString( name ) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg); //獲取url中"?"符后的字符串並正則匹配
    var context = "";
    if (r != null)
    context = r[2];
    reg = null;
    r = null;
    return context == null || context == "" || context == "undefined" ? "" : context;
}

//獲取Url中中文參數的方法

function getQueryUrlString(name) {
    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
    var r = window.location.search.substr(1).match(reg);
    if(r != null) {
        return decodeURI(r[2]);
    }
    return "請選擇";
}
$("#s").click(function(){
    var userId = getQueryString('Id');
    var dialogId = getQueryString('name');
    alert(Id);
    alert(name);
})

 

二：cookie傳值（這個跟H5的本地存儲的使用方法其實差不了多少。）

$(function(){
    var data = {
          id: "1",
          name: "dingding",
          age: 20
　　 }
    $.cookie('data',JSON.stringify(data));
    window.location = "two.html";
})

 

切記：這里一定要把data對象通過方法JSON.stringify()方法序列化成字符串。因為，cookie只能傳字符串

那么，在two.html中該如和取值呢

取值比較簡單，唯一需要切記的就是從cookie中取到的是字符串類型的數據，不能直接使用，需要用JSON.parse()方法處理一下變成對象

具體如下

$(function(){
    var data = $.cookie("data");
    var m = JSON.parse(data);
    console.log(m.id)//數據的使用
})

有不足的地方，請多多指教。