2

查看底层代码。

function displayProductsByCategory(a){
        $.getJSON('json/newjson.json', function(data) {
            $("#Product_Display_Div").empty();
            $("#Product_Display_Div").append('<h1>'+a.id+'</h1>');
             $.each(data[a.id], function(key, item) {
                 //alert("key :"+item.productPrice+"value :"+item.productName);
                 $("#Product_Display_Div").append('<ul class="columns"><li> <h3>'+item.productName
                         +'</h3><img src="'+item.ProductImageURL
                         +'" width="150" height="150" /><p> hello</p><p class="product_price">'+item.productPrice
                         +'</p><div class="info"><h2>Title</h2><p>some text</p><button onclick="doTask('+item.productName+','+item.ProductImageURL+','+item.productPrice+');"  class="addtocart" >Add to Cart</button></div></li></ul>');

            }) 
        });
    }

在此代码中，最后一行中的 onclick 属性可能会出现引号问题，它给出的错误为： Uncaught SyntaxError: Unexpected number

你能帮我吗

javascript方法是：

function doTask(productName,productPrice,productImageURL)
{

alert("inside java script");

/*this.productName=productName;
this.productPrice=productPrice;
this.productImageURL=productImageURL;
var person=prompt("Please enter the quantity","1");
person=parseInt(person);
alert(person+2);
if (!isNaN( person ))
{
    alert("yes its a number");
}
else
{
    alert("enter the valid quantity.\nShould be a Number");
}*/
  }
4

3 回答 3

2

大概，productName并且productImageURL是字符串。你的代码：

'<button onclick="doTask('+item.productName+','+item.ProductImageURL+','+item.productPrice+');"  class="addtocart" >'

会产生这样的东西：

<button onclick="doTask(Product Name,http://blahblah,123);"  class="addtocart" >

当你这样看时，你可以看到你的字符串没有被引用。由于您的字符串已经在双引号和单引号内，因此您需要对它们进行转义。

<button onclick="doTask(\''+item.productName+'\',\''+item.ProductImageURL+'\',\''+item.productPrice+'\');"  class="addtocart" >

如您所见，这很快就变得丑陋了。您可能应该考虑重构它，这样它就不是一个庞大的字符串。

此外，您的参数似乎有问题。您的方法需要第三个 URL，但您第二个传递它。

于 2013-09-20T20:33:42.047 回答
1

问题是您的字符串没有被引号字符包围。如果你检查元素，你会看到它看起来像这样：

onclick="doTask(foobar,/your/url,123.45);"

但它应该是这样的：

onclick="doTask('foobar','/your/url',123.45);"

您的代码需要像这样更改：

onclick="doTask(\''+item.productName+'\',\''+item.ProductImageURL+'\',\''+item.productPrice+'\');"

这是一个完全消除问题的重写：

function displayProductsByCategory(a){
    $.getJSON('json/newjson.json', function(data) {
        $("#Product_Display_Div").empty();
        $("#Product_Display_Div").append('<h1>'+a.id+'</h1>');
         $.each(data[a.id], function(key, item) {
             var button = $('<button></button>').addClass('addtocart').data('item',item).text('Add to Cart');
             //alert("key :"+item.productPrice+"value :"+item.productName);
             var ul = $('<ul class="columns"><li> <h3>'+item.productName
                     +'</h3><img src="'+item.ProductImageURL
                     +'" width="150" height="150" /><p> hello</p><p class="product_price">'+item.productPrice
                     +'</p><div class="info"><h2>Title</h2><p>some text</p></div></li></ul>');
             $(ul).find('div.info').append(button);
             $("#Product_Display_Div").append(ul);

        }) 
    });
}

$("#Product_Display_Div").on('click','button.addtocart',function() {
    console.log($(this).data('item')); // logs the item attached to the button. No need for parameters.
于 2013-09-20T20:34:56.997 回答
0

您的 JavaScript 是：NAME、PRICE、IMAGEURL

但是你的 JQuery 是：NAME, IMAGEURL, PRICE

那是问题吗？

于 2013-09-20T20:35:16.887 回答