添加到购物车后功能冻结按钮

时间:2021-05-25 07:30:20

标签: javascript

我想在有人将产品添加到购物车后冻结按钮。现在我的代码运行良好但并不完美。我无法向购物车添加东西,因为我的脚本冻结按钮。我想在将某些东西添加到购物车后禁用它。

let fewSeconds = 5;
$('.btn').click(function(){
    // Ajax request
    let btn = $(this);
    btn.prop('disabled', true);
    setTimeout(function(){
        btn.prop('disabled', false);
    }, fewSeconds*1000);
});

HTML:

<button data-button-action="add-to-cart" class="btn btn-primary">Dodaj do koszyka</button>

添加部分

                        <form action="https://www.ezoolandia.pl/koszyk" class="cart-form-url" method="post">
                            <input type="hidden" name="token" class="cart-form-token" value="5018573430092b3a6810d3b5c0ec836a">
                            <input type="hidden" value="2959" name="id_product">
                            <input type="hidden" class="input-group form-control" value="1" name="qty">
                            <button data-button-action="add-to-cart" id="add-to-cart" class="btn btn-primary">Dodaj do koszyka</button>
                        </form>
                    </div>```

1 个答案:

答案 0 :(得分:1)

我刚刚将您的道具更改为 attr。请检查下面的代码段。如果这就是您想要实现的目标

更新 1:仅当我们收到响应时,答案才会被禁用

更新 2:请尝试添加 id 并获取按钮

$('#add-to-cart').click(function(){
   
    let btn = $(this);
    btn.attr('disabled', true);
    // Ajax request replace with yours
    fetch('https://jsonplaceholder.typicode.com/todos/1')
    .then(response => response.json())
    .then(json => btn.attr('disabled', false))
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="btn btn-primary" id="add-to-cart">Click</button>