以下是一个使用Ajax授权后清空购物车的示例代码:
HTML代码:
JavaScript代码:
// 购物车页面加载完成后执行的函数
function loadCartItems() {
// 使用Ajax请求获取购物车中的商品数据
// 示例中使用了jQuery的Ajax方法,你也可以使用其他Ajax库
$.ajax({
url: '/api/cart/items', // 替换为实际的接口地址
method: 'GET',
success: function(response) {
// 将购物车中的商品显示在页面上
// 示例中假设接口返回的数据是一个数组
response.forEach(function(item) {
// 将商品信息添加到购物车页面的#cartItems元素中
$('#cartItems').append('' + item.name + '');
});
}
});
}
// Ajax授权后清空购物车的函数
function clearCartItems() {
// 使用Ajax请求清空购物车
$.ajax({
url: '/api/cart/clear', // 替换为实际的接口地址
method: 'POST',
success: function(response) {
// 清空购物车成功后,重新加载购物车页面
loadCartItems();
}
});
}
// 页面加载完成后的事件处理函数
$(document).ready(function() {
// 加载购物车页面
loadCartItems();
// 点击授权按钮时执行清空购物车函数
$('#authorizeButton').click(function() {
// 调用清空购物车函数
clearCartItems();
});
});
这个示例中,购物车页面加载完成后会调用loadCartItems
函数,使用Ajax请求获取购物车中的商品数据,并将商品信息显示在页面上。
当点击授权按钮时,会调用clearCartItems
函数,使用Ajax请求清空购物车,并在清空成功后重新加载购物车页面。
请注意,示例中的接口地址和数据结构是假设的,你需要将其替换为实际的接口地址和数据结构。