如何添加产品描述，添加到购物车在jQuery对话框中

Question

我在我的购物网站中使用以下代码。现在我想显示产品标题，价格，产品的简短描述，添加到jquery对话框中的购物车按钮。$（#dialog）.html ....不工作.错误显示为 ;预期。我想我没有错过任何标签。我该如何解决这个问题。

$(function () {
debugger;
$("#dialog").dialog({
modal:true,
autoOpen: false,
resizable: false,
width: "auto"
});
$(".dialogify").bind("click", function(e) {
e.preventDefault();
var producttitle='@Model.DefaultPictureModel.Title';
var productprice='@Model.ProductPrice.Price';
$("#dialog").html("<img src='" + $(this).next().find('img').attr('src') + "' width='150' + height='150'>"+"<h2>"+producttitle+"</h2>"+"<label>"+productprice+"</label>"+"<input type="button"    value="@(Model.ProductPrice.AvailableForPreOrder ? T("ShoppingCart.PreOrder") : T("ShoppingCart.AddToCart"))" class="button-2 product-box-add-to-cart-button"   onclick="AjaxCart.addproducttocart('@addtocartlink ');return false;" />");
$("#dialog").dialog("option", "position", {
modal:"true",
my: "center",
at: "center",
of: window
});
if ($("#dialog").dialog("isOpen") == false) {
$("#dialog").dialog("open");
 }
});
});

Answer 1

$('#dialog').html(...行有问题。地方。我确定。但它太长了，而且难以理解。您应该将其重写为：

$('<img>').attr('src', $(this).next().find('img').attr('src')).width(150).height(150).appendTo('#dialog');
$('<h2>').text(producttitle).appendTo('#dialog');
$('<label').text(productprice).appendTo('#dialog');
$('<input>').attr('type', 'button').value(@(Model.ProductPrice.AvailableForPreOrder) ? T("ShoppingCart.PreOrder") : T("ShoppingCart.AddToCart")).attr('class', 'button-2 product-box-add-to-cart-button' ).on('click', function(){AjaxCart.addproducttocart('@addtocartlink ');return false;}).appendTo('#dialog');