用 jquery 更新元素

Question

嗨，我有一个跨度的#item_quantity id。一旦一个按钮被点击和#update_cart 的ID。我希望跨度刷新其内容。目标数据已经在点击时更新了也有效，但似乎无法获得更新其数据的跨度。

我正在使用以下脚本尝试刷新它： 我定位的链接与我所在的页面相同。一旦产品被添加到购物车，页面被刷新，列表就会更新，所以我想我可以修改一个脚本，一旦点击某些东西就刷新那个 div，一切都会完成。但它什么也没做。

脚本

$(function() {
  $("#update_cart").click(function(evt) {
     $("#item_quantity").load("http://apecenergy.co.uk/products.php?p=4")
     evt.preventDefault();
  })
});

html

<div class="menu_cart_units "><span class="" id="item_quantity">
<cms:number_format quantity decimal_precision='0'/></span>&times;</div>
<div class="menu_cart_option"><cms:show title /></div>
<div class="menu_cart_subtotal"><span class="" id="item_price"> £<cms:number_format line_total /></span></div>

json

                "id":                <cms:show id/>,
                "quantity":          <cms:show quantity/>,
                "price":             <cms:show price/>,
                "line_total":        <cms:show line_total/>,
                "requires_shipping": <cms:if requires_shipping>true<cms:else/>false</cms:if>,
                "name":              "<cms:show name/>",
                "title":             "<cms:addslashes><cms:show title/></cms:addslashes>",
                "link":              "<cms:show link/>",
                "remove_item_link":  "<cms:pp_remove_item_link/>",
                "line_id":           "<cms:show line_id/>",

如果我使用 ajax json 方法，将会有多个与不同产品相关的 id，从每个 id 中我需要数量、名称和总行数，以便在 div 中更新。

Answer 1

// parse the JSON into a javascript object
var cart_items = JSON.parse(json);
// matches all items in the cart_items list, which have the id == 30
// filter returns an array of matched items
var matching_items = cart_items.filter(
    function (item) {
        if (item.id == 30) {
            return item;
        }
    });
// since it should only match one item, we take the first element of the array
var item = matching_items[0];
// print out the items quantity
console.log(item.quantity);

Answer 2

您的请求返回什么数据？

$("#item_quantity").load("http://apecenergy.co.uk/products.php?p=4")

假设用户返回有效的 JSON，我会说一个简单的“成功”，项目计数为 [{'result':'success'},{'count','<count>'}]，如果购物车中的项目成功更新，否则返回类似 [{'result':'error'}]! 的内容，这应该很简单

使用 jquery 进行 ajax 调用：

$.ajax({
type:"POST",
url:'Your url that return JSON encoded success with Count of items or Error message',
data:'item id to update here 4 i guess or post Data'
datatype:"JSON",
success:function(data)
{
var tmp=Jquery.parseJSON(data);
 switch(data.result)
  {
     case 'success':
           $('#item_quantity').text(data.count); //update the span  
           break;
     case 'error':
          alert('something went Wrong');
          break;
     default:
          alert('error');
          break;
  }
},
error:function()
{
   alert('Ajax Request Failed');
}
});