javascript - 推送到空数组，即使它被称为全局数组并且在我的本地主机上工作，但不在服务器上

Question

我的 javascript 中出现以下错误。正如标题所述，这段代码在我的本地主机上运行，​​但当我将它放到我的服务器上时却不行

Uncaught TypeError: Cannot read property 'push' of null
at addItemToCart (shoppingCart.js:36)
at HTMLButtonElement.<anonymous> (shoppingCart.js:193)
at HTMLDocument.dispatch (jquery-1.11.1.min.js:3)
at HTMLDocument.r.handle (jquery-1.11.1.min.js:3)

我已经确定就在调用此 push 函数之前 cart 变量确实为 null，但我将其全局声明为一个空数组，所以我不确定为什么会这样。

失败的函数代码

var cart = [];
function addItemToCart(name, price, count, id, shortName) {
    for (var i in cart) {
        if (cart[i].id === id) {
            cart[i].count += count;
            saveCart();
            for (var i in cart) {
                if (cart[i].id == 500 && id != 500) {
                    removeItemFromCart(500);
                    alert('because you changed your cart, you will have to reapply your coupon');
                }
            }
            return;
        }
    }
    for (var i in cart) {
        if (cart[i].id == 500 && id != 500) {
            removeItemFromCart(500);
            alert('because you changed your cart, you will have to reapply your coupon');
        }
    }
    var item = new Item(name, price, count, id, shortName);
    console.log(cart);
    cart.push(item);
    saveCart();
}

错误发生在 teh cart.push(item);行，因为购物车为空且无法推送到。如果有人可能需要帮助，请随时提供任何信息，我会按您的方式提供。

提前致谢!!!

编辑:

function displayCart() {
console.log("*** display Cart ***");
var cartArray = listCart();
var output = "<tr><th>Items</th><th>Quantity</th><th>Price</th></tr>";
var output2 = "<tr><th>&nbsp;</th><th>Product name</th><th>Product price</th><th>Quantity</th><th>Total</th></tr>";
var output3 = " <tr><th>Product(s)</th></tr>";
var output4 = "";
console.log(listCart());
for (var i in cartArray) {
    output += "<tr class='item'><td><div class='delete' id='removeItem' data-id='" + cartArray[i].id + "'></div>" + cartArray[i].name + "</td><td><input type='text' value='" + cartArray[i].count + "' readonly></td> <td class='price'>" + cartArray[i].price + "</td></tr>"
    output2 += "<tr class='item'>"
            + "<td class='thumb'><a href='" + cartArray[i].id + "-item.php'><img src='img/catalog/product-gallery/" + cartArray[i].id + ".png' alt='Product Image'/></a></td>"
            + "<td class='name'><a href='" + cartArray[i].id + "'-item.php'>" + cartArray[i].name + "</a></td>"
            + "<td class='price'>$" + cartArray[i].price + "</td>"
            + "<td class='qnt-count'>"
            + "<a class='incr-btn' href='#' id='oneless' data-id='" + cartArray[i].id + "'>-</a>"
            + "<input class='quantity form-control' type='text' value=' " + cartArray[i].count + " '>"
            + "<a class='incr-btn' id='onemore' data-productid='" + cartArray[i].id + "' data-name='" + cartArray[i].name + "' data-quantity='" + cartArray[i].count + "' href='#'>+</a>"
            + "</td>"
            + "<td class='total'>$<em id='test'>" + cartArray[i].total + "</em></td>"
            + "<td class='delete' id='removeAllFromCart' data-id='" + cartArray[i].id + "'><i class='icon-delete'></i></td>"
            + "</tr>";
    output3 += " <tr><td class='name border'>" + cartArray[i].shortName + "<span>x" + cartArray[i].count + "</span></td>"
            + "<td class='price border'>$" + cartArray[i].total + "</td></tr>";
    if ($("#offerCount").attr("data-id") == cartArray[i].id) {
        output4 += +"<a class='incr-btn' href='#' id='oneless' data-id='" + cartArray[i].id + "'>-</a>"
                + "<input class='quantity form-control' type='text' value=' " + cartArray[i].count + " '>"
                + "<a class='incr-btn' id='onemore' data-productid='" + cartArray[i].id + "' data-name='" + cartArray[i].name + "' data-quantity='" + cartArray[i].count + "' href='#'>+</a>";
    }
}
output3 += " <tr><td class='th border'>Shipping</td><td class='align-r border'>Free shipping</td></tr>"
        + "<tr><td class='th'>Order total</td><td class='price'>$" + totalCart() + "</td></tr>"

$("#offerCount").html(output4);
$("#productDisplay").html(output3);
$("#showFullCart").html(output2);
$("#showCart").html(output);
$("#cartTotal").html(totalCart());
$("#totalCart").html(totalCart());
$("#myCartTotal").html(totalCart());
$("#showmyTotal").html(totalCart());
$("#cartCount").html(countCart());

function addCouponToCart(coupon) {
if (coupon == 'coupon10' && couponsAdded == 0) {
    var couponReduce = -(totalCart() * .1).toFixed(2);
    addItemToCart('10% off Coupon', couponReduce, 1, 500, '10% off');
    couponsAdded += 1;
    saveCoupon();
}
displayCart();

function countCart() {
var totalCount = 0;
for (var i in cart) {
    totalCount += cart[i].count;
}
return totalCount;

function removeItemFromCartAll(id) {
for (var i in cart) {
    if (cart[i].id === id) {
        cart.splice(i, 1);
        break;
    }
}
for (var i in cart) {
    if (cart[i].id == 500 && id != 500) {
        removeItemFromCart(500);
        alert('because you changed your cart, you will have to reapply your coupon');
    }
}
saveCart();

每当设置帖子时调用 addCouponToCart 函数的代码。

   <?php if (isset($_POST['coupon_code'])) { ?>
        <script>
            addCouponToCart(coupon);
        </script>
    <?php } ?>

Answer 1

@codenoname 提供了检查空购物车的正确答案。这解决了问题，最终很多功能没有被正确定义。我将整个代码包装在一个文档就绪函数中，这似乎是问题所在。每当我删除它时，它就会起作用。谢谢大家的意见。

if (!cart) {
    cart = [];
}