如何禁用和更改 foreach 循环中单个条纹按钮的文本答案

【问题标题】：How can i disable and change text of a single stripe button that in a foreach loop如何禁用和更改 foreach 循环中单个条纹按钮的文本
【发布时间】：2018-11-22 13:18:10
【问题描述】：

我正在使用在我的产品中循环的条纹基本结帐按钮，有没有办法在提交按钮后禁用和更改按钮的文本而不影响其他产品上的按钮。我在提交付款后尝试禁用单个按钮时遇到问题，这不会影响其他产品的按钮。

所以我想要发生的事情是在我提交我的信息并完成该过程后点击“用卡付款”。我刚刚购买的产品我希望禁用该按钮，因此我只能购买该产品一次。

@foreach($userproduct as $product)
    <div class="col-md-6 col-lg-4">
      <form id="btnst" action="{{ '/account/'.Auth::user()->slug .'/'. $product->id  }}" method="POST">
          {{ csrf_field() }}
          <script
            src="https://checkout.stripe.com/checkout.js" class="stripe-button"
            data-key="pk_test_fLAtreA6Mox2p8QVJLTfSBAH"
            dat a-amount=".99"
            data-name="ex"
            data-description=" expired"
            data-email="{{ auth::check() ? auth()->user()->email : null }}"
            data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
            data-panel-label=" Run Ad {{ $product->title }} Coupon"
            data-locale="auto">
          </script>

          <script type="text/javascript">
              $(document).ready(function(){
                  $(".stripe-button-el span").remove();
                      $("button.stripe-button-el").removeAttr('style').css({
                          "display":"inline-block",
                          "width":"50%",
                          "padding":"5px",
                          "background":"#d95a5c",
                          "color":"white",
                          "font-size":"1.3em",
                          "margin-left":"30%"}).html("Advertise");
                  });
          </script>
          <input type="hidden" name="adname" value="payment">
          <input type="hidden" name="adprice" value="0.99">
          <input type="hidden" name="prod_id" value="{{$product->id }}">
      </form>
@endif

【问题讨论】：

您想在点击后禁用“用卡付款”按钮吗？
您提交表单后很快就会加载一个新页面，您能否详细说明问题？
@BhumiShah 是的，我想在提交付款后禁用“用卡付款”按钮，以便用户无法再次购买该产品
@Teemu 所以“用卡付款”弹出我输入我的信息，然后我希望在我提交付款后禁用该特定产品的按钮。所以页面上的其他产品可以用卡付款，但不是我购买的产品
请重新阅读我的评论。

标签： javascript jquery laravel stripe-payments

【解决方案1】：

这可以通过添加 disabled 属性纯粹在前端完成。

$(".your-button").on("click", function(){
 $(this).setAttr("disabled", "disabled");
});

现在这当然有一个缺点，它不能确定产品购买是否通过（完成）。

另一种方法是简单地使用 ajax 轮询服务器以了解此付款的状态，一旦您收到真正的禁用它。

您可以混合使用这两种方法。

【讨论】：