-2

如何在不刷新页面的情况下使用加号、减号按钮更新我正在处理的自定义 PHP 购物车中的产品计数？

我想在不重新加载页面的情况下添加或删除数量。

我在购物车中的产品如下所示。

汉堡 $3.99
意大利面碗 $8.99

我想要一个图像按钮来增加或减少如下所示的数量。当您单击加号或减号时，应显示增加和减少的选项。

1 个汉堡 $3.99
2 个意大利面碗 $17.98

谢谢，拉吉

4

2 回答 2

0 
$('#plus').click(function(){
  $.get('yourphpfile?val=value_to_increment', function(data){
    //code to update your html. 
    //data variable will hold whatever you echo from php.
    //it's considering only simple use, you can use JSON for more complex operations.
  });
});

基本上你所要做的就是在点击图像时创建一个事件（每个按钮一个）然后将值传递给 php 服务器/文件，其中包含要从服务器更新的数据，在回调函数中你只需要更新 dom （您的 html）使用 php 代码提供的数据。

于 2013-05-07T17:22:16.587 回答
0

正如 webgal 所建议的，AJAX 是前进的方向。让加号/减号按钮调用一个函数，说明updateQuantity(direction)方向是向上还是向下（取决于单击的按钮。因此，加号按钮将调用updateQuantity(1)，减号按钮将调用updateQuantity(-1)并使用该值来操纵购物车中对象的数量。

简单的 AJAX 代码（您只需根据自己的需要进行定制）如下：

function updateQuantity(direction){
   var xmlhttp;

   if(window.XMLHttpRequest){
        // For new browsers and IE7+
        xmlhttp=new XMLHttpRequest();
        console.log('created XMLHttpRequest');
   }else{
        // For old IE versions (volatile)
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        console.log('created ActiveXObject');
   }

   xmlhttp.onreadystatechange=function(){
       if(xmlhttp.readyState==4 && xmlhttp.status==200){
           //if the AJAX call is finished and the HTTP status is 200 (OK)
           console.log('response received');
           var e = document.getElementById('theElementYouWantToChange');
           e.innerHTML = xmlhttp.responseText;
       }else if(xmlhttp.readyState==4 && xmlhttp.status!=200){
       //second if condition specified, else the console will log an error
       //whenever the readystate changes, and this happens 3 times during
       //an acceptable AJAX call    
           console.log("Error retrieving search response. Status: "+xmlhttp.status);
        }
    }

    xmlhttp.open("GET","includes/updateCart.php?product="+productID+"&change="+direction,true);
    xmlhttp.send();
}

您需要设置附加到您正在修改数量的产品的变量 productID

于 2013-05-07T17:23:52.013 回答