如何正确设置$ .cookie所以它只会在当前页面上存活

时间:2014-02-11 18:58:51

标签: javascript jquery cookies

我使用$ .cookie即使在重新加载后也会保存当前的页面形式:

这是我的JS:

$(document).ready(function() {
if($.cookie('Table_Rows')){
loadCookieData();
$(".qty, .price").bind("keyup change", calculate);
 }
 else{addRow(0);}
});

我在页面重新加载之前保存我的cookie :(我可以这样做吗?)

window.onbeforeunload = function(event)
{
storeRowData();
console.log("cookie saved!");
};

但我的主要问题是,即使我导航到其他页面,如:

http://mydomain.dev/purchase_orders/create/2< - 此处创建的Cookie

http://mydomain.dev/purchase_orders/create/3< - loadCookieData();仍将被触发?

我希望它仅保留在1个网址/页面上,不会影响其他网页?有什么想法吗?

storeRowData.js

var storeRowData = function () {
 var data = []; 
$('#tblItemList tbody>tr:visible').each(function () {
    var $this = $(this),

        pId = $this.find("#itemId").val();
        pname = $this.find('input.itemSearch').attr("value"),
        desc = $this.find(".description").val(),
        quant = $this.find(".qty").val(),
        rowId = $this.find(".rowId").val(),
        price = $this.find(".price").val();

    var temp = { 
        productName: pname, 
        itemId:pId,
        description: desc,
        quantity: quant, 
        price: price, 
        rowId: rowId };
    data.push(temp);
});
$.cookie('Table_Rows', JSON.stringify(data), {expires: 7, path: '/'});
}

loadCookieData.js

function loadCookieData(){

temp = $.cookie('Table_Rows');
var parseData = JSON.parse(temp);
console.log(parseData);
var html ='';



for (i in parseData) {

    subTotal = parseData[i].quantity*parseData[i].price;
    var st = new Number(subTotal);
    var sub = st.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');

html+="<tr><td><input id='itemName"+parseData[i].rowId+"' value='"+parseData[i].productName+"' required name='product["+parseData[i].rowId+"][name]' class='form-control col-lg-5 itemSearch' type='text' placeholder='select item' />"+
  "<input type='hidden' class='rowId' value='"+parseData[i].rowId+"'>"+
  "<input type='hidden' name='product[" + parseData[i].rowId + "][itemId]' value='"+parseData[i].itemId+"' id='itemId'></td>"+
  "<td><textarea readonly name='product["+parseData[i].rowId+"][description]' class='form-control description' rows='1' >"+parseData[i].description+"</textarea></td>"+
  "<td><input type='number' value='"+parseData[i].quantity+"' min='1' max='9999' name='product["+parseData[i].rowId+"][quantity]' class='qty form-control' required />"+
  "<input id='poItemId' type='hidden' name='product[" + parseData[i].rowId + "][poContentId]'></td>"+
  "<td><input type='number' value='"+parseData[i].price+"' min='1' step='any' max='9999' name='product["+parseData[i].rowId+"][price]' class='price form-control' required /></td>"+
  "<td class='subtotal'><center><h3>"+sub+"</h3></center></td>"+
  "<input type='hidden' name='product["+parseData[i].rowId+"][delete]' class='hidden-deleted-id'>"+
  "<td class='actions'><a href='#' class='btnRemoveRow btn btn-danger'>x</a></td>"+
  "</tr>";
    }

$("#tblItemList tbody").html(html);

for (i in parseData){
  var inputBox = "#itemName"+parseData[i].rowId;
  $(inputBox).select2(sOptions);
}
calculate(); 
}

任何建议/评论都会非常感激!非常感谢你的时间,祝你有个美好的一天!

1 个答案:

答案 0 :(得分:1)

尝试在保存cookie时存储页面信息。

如果您在页面http://mydomain.dev/purchase_orders/create/2上,请尝试将Cookie保存为

$.cookie('Table_Rows-2', JSON.stringify(data), {expires: 7, path: '/'});

每当您尝试加载Cookie时,请使用页码,如果您在第3页,则不会加载Table_Rows-2 Cookie。

相关问题