从 Django 模板向 JavaScript 函数传递参数时出现语法错误

Question

我必须将 Django 模板中的 4 个参数传递给 JavaScript 函数。 在这 4 个中，3 个是整数/小数，1 个是字符串。

<button onclick="addCart({{ item.id }}, {{ item.price }}, {{ item.discount }}, {{item.name}})">
               Add to cart
</button>

这是 Javascript 函数。

let USER_CART = [];
function addCart(itemId, itemPrice, itemDiscount, itemName) {
    let itemQuantity = parseInt(document.getElementById(itemId).value);
    if (itemQuantity > 0) {
        let item_index = USER_CART.findIndex(item => item.id === itemId);
        if (item_index === -1) {
            let item = {
                id: itemId,
                price: itemPrice,
                discount: itemDiscount,
                quantity: itemQuantity,
                title: itemName,
            };
            USER_CART.push(item);
        } else {
            USER_CART[item_index].quantity += itemQuantity;
        }
    }
}

每当我单击按钮时，此错误都会显示在控制台上。

SyntaxError: missing ) after argument list

另一个有趣的事情是，如果我从代码中完全删除item.name和itemName ，它就可以正常工作。

Answer 1

您需要在{{item.name}}周围添加引号。

<button onclick="addCart({{ item.id }}, {{ item.price }}, {{ item.discount }}, '{{item.name}}')">
               Add to cart
</button>