有人可以告诉我,点击商店前面的“添加到购物车”按钮会执行哪个功能?单击“添加到购物车”按钮时将执行哪些代码或方法?我观察到发生了一些计算。
在视图/主题/ * /template/product/product.tpl
<input type="hidden" name="product_id" size="2" value="<?php echo $product_id; ?>" />
<input type="button" value="<?php echo $button_cart; ?>" id="button-cart" class="button" />
在javascript中
<script type="text/javascript"><!--
$('#button-cart').bind('click', function() {
$.ajax({
url: 'index.php?route=checkout/cart/add',
type: 'post',
data: $('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\']:checked, .product-info input[type=\'checkbox\']:checked, .product-info select, .product-info textarea'),
dataType: 'json',
success: function(json) {
$('.success, .warning, .attention, information, .error').remove();
if (json['error']) {
if (json['error']['option']) {
for (i in json['error']['option']) {
$('#option-' + i).after('<span class="error">' + json['error']['option'][i] + '</span>');
}
}
}
alert(json['success']);
if (json['success']) {
$('#notification').html('<div class="success" style="display: none;">' + json['success'] + '<img src="catalog/view/theme/palioxis/image/close.png" alt="" class="close" /></div>');
$('.success').fadeIn('slow');
$('#cart-total').html(json['total']);
$('html, body').animate({ scrollTop: 0 }, 'slow');
}
}
});
});
//--></script>
有人可以介绍一下这里发生了什么吗?
答案 0 :(得分:4)
jQuery代码查找id为'button-cart'
。
单击它后,它将运行下面的Ajax代码。数据将传输到route=checkout/cart/add
网址。
该文件调用您的/controller/checkout/cart.php
文件并查找add()
函数。传递给add()
函数的数据来自'data'。
然后,如果数据正确传递,jQuery代码将提示来自json['success']
的警报消息并加载DIV层。
否则,如果数据未正确传递,则会在页面上显示错误消息。
如果这有助于您了解它,请告诉我。我使用Opencart。