2016-08-24 79 views
0

我正在一家電子商店工作,其中插入到購物籃中的物品被插入到名爲BasketItemNumber_I的jStorage鑰匙中[其中我是一個int並且其他所有物品都以i ++的名義獲得]。此jStorage對象以何種方式不同,爲什麼?

例如:BasketItemNumber_1,BasketItemNumber_2等。

現在,我的客戶問我要添加一個輸入,其中一個項目的件數將是,讓客戶端可以修改int無需使用+ 1和-1功能。

假設我在籃子裏有一件物品。當我回響在控制檯這個項目,它看起來像這樣:

Console echo in Chrome before the change

現在,我們的目標是到對象的一塊值更改爲一個用戶寫入輸入,因此該項目具有onfocusout功能,看起來像這樣:

function onFocusOutFunction(jStorageItemName, i) { 

console.log(jStorageItemName + " Focus Out"); 
var jStorageFocusedOutBasketPiece = $.jStorage.get(jStorageItemName); 

console.log("jStorageFocusedOutBasketPiece: " + jStorageFocusedOutBasketPiece[0].piece); 
var inputFocusedOutBasketPiece = document.getElementById('pieceInput_' + i).value; 
inputFocusedOutBasketPiece = inputFocusedOutBasketPiece.replace(/\D/g,''); 
console.log("inputFocusedOutBasketPiece: " + inputFocusedOutBasketPiece); 

function isNumber(obj) { return !isNaN(parseFloat(obj)) } 

console.log(isNumber(inputFocusedOutBasketPiece)); 


if (inputFocusedOutBasketPiece == jStorageFocusedOutBasketPiece[0].piece){ 
    console.log("Values are the same"); 
}else { 

    console.log("Values are not the same, therefore piece value will be changed"); 

    console.log("Before change"); 
    console.log(jStorageFocusedOutBasketPiece); 

    jStorageFocusedOutBasketPiece[0].piece = parseInt(inputFocusedOutBasketPiece); 

    $.jStorage.set(jStorageItemName, jStorageFocusedOutBasketPiece[0]); 
    $.jStorage.setTTL(jStorageItemName, 604800000); 

    console.log("After the change"); 
    console.log(jStorageFocusedOutBasketPiece); 

    console.log("After jStorage set"); 
    console.log(jStorageItemName); 
    console.log($.jStorage.get(jStorageItemName)); 

    window.location.assign('basket.php'); 

} 

} 

但是,每當我改變的值(以便這個功能可以做它的東西)。該BasketItemNumber_1的輸出是這樣的:

Console echo in Chrome after the change

該項目未在籃下上市了,因爲我與這部分代碼來檢查:(我知道我用eval,這是一個不好的做法,我打算稍後改變它,現在我需要完成概念驗證,而不是實際的產品)。

for (var i = 1, len = jStorageIndex.length; i < len; i++){ 


jStorageItemContents = eval("$.jStorage.get('BasketItemNumber_" + i + "')"); 
jStorageItemName  = "BasketItemNumber_" + i 


if (typeof jStorageItemContents == "undefined" || ! (jStorageItemContents instanceof Array)) { 

console.log("An array is empty, skipping."); 

}else { 


if(jStorageItemContents[0].active == "true"){ 

...等等。

基本上,我沒有看到一個項目,但我看到「一個數組是空的,跳過」在控制檯中。

我必須使用上面的邏輯,因爲有時候BasketItems是空的(在用戶刪除它們之後,它們的空數組有時會留在緩存中),因此我只想顯示那些實際包含了某些內容的東西。

因此,我必須問:爲什麼改變對象的表現方式?

我看到的區別在於它們都在控制檯中outputed的方式,更特別是在[]和{},但我不明白,是什麼使這種變化可能與如何進行:

我寧願改變一個對象所代表的方式來改變它的值,以匹配它曾經有過的格式,這樣我就不必去混淆上面的類型邏輯了,因爲還有其他東西依賴於它作爲好。

注意:還有一個+和 - 按鈕,分別改變件的值。

這些功能是:

$(document).on('click', '#addPieceButton', function(){ 

var variable = $(this).attr('itemname'); 
var variable = variable.toString(); 

var basketItem = $.jStorage.get(variable); 


basketItem[0].piece = parseInt(basketItem[0].piece) + 1; 
console.log(basketItem[0].piece); 

    $.jStorage.set(variable, basketItem); 
    $.jStorage.setTTL(variable, 604800000); 

    console.log($.jStorage.get(variable)); 

    location.reload(true); 




}); 

$(document).on('click', '#removePieceButton', function(){ 

var variable = $(this).attr('itemname'); 
var variable = variable.toString(); 

var basketItem = $.jStorage.get(variable); 

basketItem[0].piece = parseInt(basketItem[0].piece) - 1; 

if(basketItem[0].piece == 0){ //If there is 0, we will show the warning 

    if (window.confirm("By changing the pieces to 0 the item will disappear? Do you want to continue?")) { 

     //This will change the active to false, thanks to which it will be no longer displayed 
     for (var i in basketItem) { 
     if (basketItem[i].active == "true") { 
      basketItem[i].active = "false"; 
      break; //Stop this loop, we've found it! 
    } 
    } 
     $.jStorage.set(variable, basketItem); 
     $.jStorage.setTTL(variable, 604800000); 

     console.log($.jStorage.get(variable)); 

     location.reload(true); 

    } 
    else { 
    console.log("User answered NO"); 
    location.reload(true); 
    } 

}else { 


console.log(basketItem[0].piece); 

    $.jStorage.set(variable, basketItem); 
    $.jStorage.setTTL(variable, 604800000); 

    console.log($.jStorage.get(variable)); 

    location.reload(true); 


    } 
}); 

和他們很好地工作。通過寫下來,我以某種方式感覺到原因將在某個地方,我不使用jQuery的功能,我有問題。

回答

1

好了,當你更改後保存新的項目,你重寫原數組和索引0投入的元素(在下面一行):

$.jStorage.set(jStorageItemName, jStorageFocusedOutBasketPiece[0]); 

這就是爲什麼它在這一點上不再是一個數組。
您可能只想替換存儲中的相關項目,然後重新設置整個陣列。只要消除了指數:

$.jStorage.set(jStorageItemName, jStorageFocusedOutBasketPiece); 

發生了什麼事是你曾經有過的項目列表,你重寫它是隻有第一個這些項目的後面。

側面說明: 你說得對EVAL,坦率地說,沒有理由你不立即消除它。只需用此替換該零件:

jStorageItemName = 'BasketItemNumber_' + i; 
jStorageItemContents = $.jStorage.get(jStorageItemName); 
+0

謝謝!我需要一個人從盒子外面看它。我沉浸在其中,我根本沒有看到! :)並感謝您的評估解決方案! – MathewG

相關問題