Question

由于我只有一个djstripe订阅计划，我试图让我的djstripe付款/订阅页面弹出付款模式而不需要点击。单击按钮时使用的JavaScript是：

$(function() {   
    $('body').on("click", '.djstripe-subscribe button[type=submit]', function(e) {
      e.preventDefault();
      // retrieve current $(".djstripe-subscribe")
      var $form = $(e.target).parents('form'),
          token = function(res) {
            $form.find("input[name=stripe_token]").val(res.id);
            $("button[type=submit]").attr("disabled", "true");
            $('#in-progress').modal({"keyboard": false})
            $('.progress-bar').animate({width:'+=100%'}, 2000);
            $form.trigger("submit");
          };
      StripeCheckout.open({
        key:         "{{ STRIPE_PUBLIC_KEY }}",
        name:        'Payment Method',
        panelLabel:  'Add Payment Method',
        token:       token
      });

      return false;
    });
    {% if PLAN_LIST|length > 1 %}
      $('.djstripe-change-plan').click(function(e){
          $("button[type=submit]").attr("disabled", "true");
          $('#in-progress').modal({"keyboard": false})
          $('.progress-bar').animate({width:'+=100%'}, 2000);
          var $form = $(this);
          $form.trigger("submit");
      });
    {% endif %}

});

我已经能够通过删除包装函数并将脚本放入文档就绪函数来弹出模式，如下所示：

 $(document).ready(function(e) {
      // retrieve current $(".djstripe-subscribe")
      var $form = $(e.target).parents('form'),
          token = function(res) {
            $form.find("input[name=stripe_token]").val(res.id);
            $("button[type=submit]").attr("disabled", "true");
            $('#in-progress').modal({"keyboard": false})
            $('.progress-bar').animate({width:'+=100%'}, 2000);
            $form.trigger("submit");
          };
      StripeCheckout.open({
        key:         "{{ STRIPE_PUBLIC_KEY }}",
        name:        'Payment Method',
        panelLabel:  'Add Payment Method',
        token:       token
      });

      return false;
    });
    {% if PLAN_LIST|length > 1 %}
      $('.djstripe-change-plan').click(function(e){
          $("button[type=submit]").attr("disabled", "true");
          $('#in-progress').modal({"keyboard": false})
          $('.progress-bar').animate({width:'+=100%'}, 2000);
          var $form = $(this);
          $form.trigger("submit");
      });
    {% endif %}

然而，这消除了.djstripe-subscribe按钮[type = submit]选择器，导致e.preventDefault（）的错误，除非我删除它，如此代码片段所示，并使之后出现的“服务器更新”付款方式是永久提交的，没有结果。如何让模式弹出并成功更新？

Answer 1

您可以这样做的一种方法是在代码的第一个版本上使用jQuery的.click（）方法（https://api.jquery.com/click/），但是请点击＆＃39;页面上的元素加载？

弹出djstripe支付模式，无需点击按钮

1 个答案: