无需单击按钮即可弹出 djstripe 支付模式

Question

由于我只有一个 djstripe 订阅计划，我试图让我的 djstripe payments/subscribe 页面无需点击即可弹出支付模式。单击按钮后的 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() 错误，除非我按照此代码片段所示将其删除，并使 "server update" 提交付款方式后出现，永远没有结果。怎样才能让模态弹出并成功更新？

Answer 1

一种方法是在代码的第一个版本上使用 jQuery 的 .click() 方法 (https://api.jquery.com/click/)，但是 'click' 页面上的元素加载？

无需单击按钮即可弹出 djstripe 支付模式

Pop up djstripe payments modal without button click

javascript

jquery

stripe-payments