如何转义作为参数传递的字符串——无效的语法。 缺少 ) 参数列表后

Question

I keep getting this error when trying to use jquery append.

Uncaught SyntaxError: missing ) after argument list

Here is my code:

$(".grid-uniform").append('<input type="checkbox" id="addToCompare-'+prod.id+'" class="addToCompare" onclick="addProductToCompare('+prod.id+','+prod.json.variants[0].id+','+prod.title+')">');

Here are the values being passed in:

addProductToCompare(1557908979773,13234446893117,Apple iPhone X - Zizo ION Triple Layered Hybrid Rugged Case with Tempered Glass, Smoke/Clear)

It looks like the 'with' in the string is getting picked up as JavaScript. It should just be a string. When I check typeof it returns string. If I swap prod.price instead of prod.title though and keep everything else the same, it works fine.

Answer 1

It is because you don't make the third argument a string literal, delimiting with quotes.

$(".grid-uniform").append(
    '<input type="checkbox" id="addToCompare-'+prod.id+'" class="addToCompare" ' +
    'onclick="addProductToCompare('+prod.id+','+prod.json.variants[0].id+',\''+prod.title+'\')">'
);

Note the added \\' around the last argument.

The better way to do this:

$(".grid-uniform").append(
     $('<input>').attr({type: "checkbox", id: "addToCompare-"+prod.id})
         .addClass("addToCompare")
         .click(function () {
              addProductToCompare(prod.id, prod.json.variants[0].id, prod.title);
         })
);