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

你們好，我是小C：

咱們在作一些網站須要傳值交互，最近我就遇到了這問題，若是用H5的本地存儲，IE8如下是不能支持的，可是官方說到IE8及以上就支持，可是某些版本仍是存在問題。因此咱們來看看下面兩種方法吧！

第一種方法：url傳值（就像能夠經過超連接的href屬性傳值是同樣的）

舉例：

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

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

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

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

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

 

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

1 $(function(){
2     var data = {
3           id: "1",
4           name: "dingding",
5           age: 20
6 　　 }
7     $.cookie('data',JSON.stringify(data));
8     window.location = "two.html";
9 })

 

切記：這裏必定要把data對象經過方法JSON.stringify()方法序列化成字符串。由於，cookie只能傳字符串

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

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

具體以下

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

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