最后点击增量或减量按钮,调用ajax函数

时间:2016-03-01 09:57:06

标签: javascript ajax prototype

我有一个增量按钮,它一直在调用ajax,它们说的加载时间过长。

<div id="topproqty890" class="product-qty qty_cover">
    <div style=" display:none;" id="myContenttop890" class="outer">
       <input type="number" pattern="[0-9.]+" id="topproqtyinput890" value="18" min="0" name="tex" class="input">
       <input type="button" onclick="var qty_el = document.getElementById('topproqtyinput890');
         qty_div = document.getElementById('topproqtydiv890');

          if(!qty_el.value || qty_el.value &lt; 0)
             { 
             return false;
            }
           qty_div.innerHTML=qty_el.value;
           document.getElementById('myContenttop890').style.display='none';
           return addtocartcusmtom(890,'top');" value="ok" name="button" class="button">
           <div class="arow"><img alt="" src="http://10.10.10.77/nemlig/skin/frontend/default/nemlig/images/arow_qty.jpg"></div>
            </div>
               <div onclick="var qty_el = document.getElementById('topproqtyinput890');
                 qty_div = document.getElementById('topproqtydiv890'); var qty = qty_el.value; if( !isNaN( qty ) &amp;&amp; qty &gt; 0 ) qty_el.value--;
                                        qty_div.innerHTML=qty_el.value;return addtocartcusmtom(890,'top');" class="left_b"> - </div>
              <div onclick="var qty_el = document.getElementById('topproqtyinput890');
                                        qty_div = document.getElementById('topproqtydiv890');
               var qty = qty_el.value; if( !isNaN( qty )) qty_el.value++;
                                         qty_div.innerHTML=qty_el.value;return addtocartcusmtom(890,'top');" class="right_b"> + </div>
                <div onclick="javascript:toggleDiv('myContenttop890');" id="topproqtydiv890" class="input">42</div>
                </div>

jsfiddle

我的ajax代码

function addtocartcusmtom(pro_id,prefix)
    {

       var qty =$(prefix+'proqtyinput'+pro_id).getValue();
       if(!qty || qty < 0)
         { 
         return false;
         }




       var url="<?php echo Mage::getUrl('cartupdater') ?>";

       cartajax =new Ajax.Request(url, {
              method: 'post',   
              parameters: {qty: qty, product: pro_id},
              onFailure: function(response){
    cartajax=undefined;
        return false;
    },


    onSuccess: function(response)
    { 


          response = response.responseText.evalJSON(true); 


        return false;







    }
          }); 
    }

1 个答案:

答案 0 :(得分:1)

我的建议是,

你的方法很好,你必须改变你的场景,不要在inc / decrements按钮上调用你的ajax方法,原因。

例如,用户在购物车中添加了3 items,而3 items则随机点击了现在10 times(each, in a single minute)现在3 * 10 = 30 ajax req发送到服务器的inc /减量30 * 10 = 300。类似地,有10个人做同样的事情,例如300现在看起来 // for image color var bgArray = [ 'https://d2z4fd79oscvvx.cloudfront.net/0020444_black_forest_cake_205.jpeg', 'https://d2z4fd79oscvvx.cloudfront.net/0019255_profound_love_a_bunch_of_15_red_and_15_white_roses_205.jpeg', 'http://lorempixel.com/400/200/sports/3', 'https://d2z4fd79oscvvx.cloudfront.net/0019255_profound_love_a_bunch_of_15_red_and_15_white_roses_205.jpeg', ] $('#chatroom').on('change', function(){ value = $(this).val() - 1; $('.bgDiv').css({'background-image':'url(' + bgArray[value] + ')'}); }); //DIv into image function ImageCanvas() { html2canvas($("#widget"), { onrendered: function (canvas) { theCanvas = canvas; consoel.log(theCanvas.toDataURL()); document.querySelector('.imageViewcanvas').src = theCanvas.toDataURL(); } }); }请求在一分钟内造成服务器的负担。它会导致懒惰。

所以我建议这种技术。看here