php - jquery优化ajax请求？ PHP 和 JS

Question

我有按钮。单击此按钮发送 $.post() 请求并将项目添加到购物篮。我希望如果用户快速点击按钮十次，它不能发送 10 个请求，而只能发送一个宽度计数 10。代码如下:

<div class='qty'>
<input type='text' id="qty" value='1'>
<a class='button' href='#'>add To Basket</a>

</div>

脚本:

$(document).ready(function(){

  $(".button").click(function(){

    var qty=$(this).parent().find(input[type='text']).val();

    $.post('/ajax.php', "qty="+qty, function(){
      $(this).parent().find(input[type='text']).val("1");

    });

  });

});

Answer 1

这是一个基本的去抖动问题。更改 <input id="qty">至 <input class="qty">和:

$('.button').click(function(e) {
    var btn = $(this), qty = btn.parent().find('.qty');

    clearTimeout(btn.data('timeout'));

    qty.val(qty.val()+1);

    btn.data('timeout', setTimeout(doPost(qty), 1000));
});

function doPost(el) {
     return function() {
         $.post('/ajax.php', {qty:el.val()});
     }
}