我正在一家电子商店工作，其中一个插入篮子的项目被插入名为BasketItemNumber_I[其中我是一个 int 并且所有其他项目的名称为 i++] 的 jStorage 键中。
例如：BasketItemNumber_1、BasketItemNumber_2 等。
现在，我的客户要求我添加一个输入，其中一个项目的件数将是，以便客户可以更改 int 而无需使用 + 1 和 - 1 函数。
假设我在篮子里有一件物品。当我在控制台中回显这个项目时，它看起来像这样：
现在，目标是将对象的片段值更改为用户已写入输入的一个值，因此该项目有一个 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 的输出如下所示：
该项目不再列在篮子中，因为我必须用这部分代码检查它：（我知道我使用 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 是空的（在用户删除它们后，它们的空数组有时会保留在缓存中）因此我只想显示那些实际包含某些内容的数组。
因此我不得不问：是什么，如何以及为什么改变了对象的表示方式？
我看到不同之处在于它们在控制台中的输出方式，更具体地说是在 [] 和 {} 中，但我不明白是什么使这种改变成为可能以及如何进行：
我宁愿在块值更改后更改对象的表示方式以匹配它曾经拥有的格式，这样我就不必弄乱上面的 typeof 逻辑，因为还有其他依赖它的东西.
注意：还有一个 + 和 - 按钮，分别更改件值。
这些功能是：
$(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 来处理我遇到问题的函数。