Question

我正在使用分页，当我在购物车中添加产品时，它只适用于第一页。当我点击第二页并尝试将产品添加到购物车时，ajax无法正常工作。

它如何在第二页上运行？提前谢谢。

JavaScript代码：

<script>
var monkeyList = new List('test-list', {
valueNames: ['name'],
page:9,
pagination: true

});
</script>

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js">
 </script>

 <script>
 $(function(){
 $("#form").click(function(event){
 event.preventDefault();
 $.ajax({
 url:'<?php echo base_url().'cart/add/';?>',
 type:'POST',
 async: false,
 data:$(this).serialize(),
 success:function(result){

 $('#response').load('<?php echo base_url().'Products/menu';?>');
 }
 });
 });
});
</script>

Answer 1

您必须将click事件绑定到每个页面中的所有产品。你的代码将click事件仅绑定到当前页面上的产品。

$(function(){
 $("#form").click(function(event){
 event.preventDefault();
 $.ajax({
 url:'<?php echo base_url().'cart/add/';?>',
 type:'POST',
 async: false,
 data:$(this).serialize(),
 success:function(result){

 $('#response').load('<?php echo base_url().'Products/menu';?>');
 }
 });
 });
});

由于其他页面中的产品将被隐藏，因此它不在选择器$（＆＃34;＃form＆＃34;）的范围内。因此无法将点击事件绑定到所有人。

您可以将eventlistener添加到函数中，并在页面更改时调用该函数。

function AddToCart(){
$("#form").click(function(event){
 event.preventDefault();
 $.ajax({
 url:'<?php echo base_url().'cart/add/';?>',
 type:'POST',
 async: false,
 data:$(this).serialize(),
 success:function(result){

 $('#response').load('<?php echo base_url().'Products/menu';?>');
 }
 });
 });
}

$（函数（）{AddToCart（）;} 类似地，您可以在页面更改时调用此函数

在php中的ajax上应用jQuery分页

1 个答案: