Javascript 提交按钮不存在'；无法在条带验证失败时重新启用

当使用JQuery/AJAX/JS提交表单_for（）表单时，提交按钮无法重新启用，即使我编写了将prop切换为disabled false的代码

我在控制台中成功地激活了相同的JS代码行，但是当条带验证正常失败时，它就不起作用了

var StripepayOnestepSubscriptionForm = {
   initialize: function () {
    $(document).off('submit.stripepay-onestep-subscription-form').on(
        'submit.stripepay-onestep-subscription-form', '.stripepay-onestep-subscription-form',
        function () {
            return StripepayOnestepSubscriptionForm.handleSubmit($(this));
        }
    );
},

handleSubmit: function (form) {
    if (!StripepayOnestepSubscriptionForm.validateForm(form)) {
        return false;
    }

    $(form).find('div :submit')
        .prop('disabled', true).change();
    $('.stripepay-spinner').css('visibility', 'visible');

    Stripe.card.createToken(form, function (status, response) {
        StripepayOnestepSubscriptionForm.stripeResponseHandler(form, status, response);
    });
    return false;
},

validateForm: function (form) {
    var cardNumber = $("input[data-stripe='number']").val();
    if (!Stripe.card.validateCardNumber(cardNumber)) {
        StripepayOnestepSubscriptionForm.showError(form, 'The card number is not a valid credit card number.');
        return false;
    }
    if ($("[data-stripe='exp']").length) {
        var valid = !Stripe.card.validateExpiry($("[data-stripe='exp']").val());
    } else {
        var expMonth = $("[data-stripe='exp_month']").val();
        var expYear = $("[data-stripe='exp_year']").val();
        var valid = !Stripe.card.validateExpiry(expMonth, expYear);
    }
    if (valid) {
        StripepayOnestepSubscriptionForm.showError(form, "Your card's expiration month/year is invalid.");
        return false
    }

    var cvc = $("input[data-stripe='cvc']").val();
    if (!Stripe.card.validateCVC(cvc)) {
        StripepayOnestepSubscriptionForm.showError(form, "Your card's security code is invalid.");
        return false;
    }

    return true;
},

stripeResponseHandler: function (form, status, response) {
    if (response.error) {
        StripepayOnestepSubscriptionForm.showError(form, response.error.message);
    } else {
        var email = form.find("[data-stripepay='email']").val();
        var coupon = form.find("[data-stripepay='coupon']").val();
        var quantity = form.find("[data-stripepay='quantity']").val();

        var base_path = form.data('stripepay-base-path');
        var plan_type = form.data('stripepay-plan-type');
        var plan_id = form.data('stripepay-plan-id');

        var action = $(form).attr('action');

        form.append($('<input type="hidden" name="plan_type">').val(plan_type));
        form.append($('<input type="hidden" name="plan_id">').val(plan_id));
        form.append($('<input type="hidden" name="stripeToken">').val(response.id));
        form.append($('<input type="hidden" name="stripeEmail">').val(email));
        form.append($('<input type="hidden" name="coupon">').val(coupon));
        form.append($('<input type="hidden" name="quantity">').val(quantity));
        form.append(StripepayOnestepSubscriptionForm.authenticityTokenInput());
        $.ajax({
            type: "POST",
            url: action,
            data: form.serialize(),
            success: function (data) {
                StripepayOnestepSubscriptionForm.poll(form, 60, data.guid, base_path);
            },
            error: function (data) {
                StripepayOnestepSubscriptionForm.showError(form, jQuery.parseJSON(data.responseText).error);
            }
        });

    }
},

poll: function (form, num_retries_left, guid, base_path) {
    if (num_retries_left === 0) {
        StripepayOnestepSubscriptionForm.showError(form, "This seems to be taking too long. Please contact support and give them transaction ID: " + guid);
    }
    var handler = function (data) {
        if (data.status === "active") {
            window.location = base_path + '/confirm_subscription/' + guid;
        } else {
            setTimeout(function () {
                StripepayOnestepSubscriptionForm.poll(form, num_retries_left - 1, guid, base_path);
            }, 500);
        }
    };
    var errorHandler = function (jqXHR) {
        StripepayOnestepSubscriptionForm.showError(form, jQuery.parseJSON(jqXHR.responseText).error);
    };

    if (typeof guid != 'undefined') {
        $.ajax({
            type: 'GET',
            dataType: 'json',
            url: base_path + '/subscription_status/' + guid,
            success: handler,
            error: errorHandler
        });
    }
},

showError: function (form, message) {
    $('.stripepay-spinner').css('visibility', 'hidden');
    $(form).find('div :submit')
        .prop('disabled', false).change()
        .trigger('error', message);

    var error_selector = form.data('stripepay-error-selector');
    if (error_selector) {
        $(error_selector).text(message);
        $(error_selector).show();
    } else {
        form.find('.stripepay-payment-error').text(message);
        form.find('.stripepay-payment-error').show();
    }
},

authenticityTokenInput: function () {
    return $('<input type="hidden" name="authenticity_token"></input>').val($('meta[name="csrf-token"]').attr("content"));
  }
};

StripepayOnestepSubscriptionForm.initialize();

var StripepayOnestepSubscriptionForm={
初始化：函数（）{
$（文档）.off（'submit.stripepay一步订阅表单'）。on(
'提交.stripepay一步订阅表单'，'.stripepay一步订阅表单'，
函数（）{
返回StripepayOnestepSubscriptionForm.handleSubmit（$（this））；
}
);
},
handleSubmit:函数（形式）{
如果（！StripepayOnestepSubscriptionForm.validateForm（表单））{
返回false；
}
$（表单）.find（'div:submit'）
.prop（'disabled'，true）.change（）；
$（'.stripepay微调器'）.css（'可见性'，'可见'）；
Stripe.card.createToken（表单、函数（状态、响应）{
StripepayOnestepSubscriptionForm.stripeResponseHandler（表单、状态、响应）；
});
返回false；
},
validateForm:函数（表单）{
var cardNumber=$（“输入[data stripe='number']”）val（）；
如果（！Stripe.card.validateCardNumber（cardNumber））{
StripepayOnestepSubscriptionForm.batherRor（表格“卡号不是有效的信用卡号”）；
返回false；
}
if（$（“[data stripe='exp']”）.length）{
var valid=！Stripe.card.validateExpiry（$（“[data Stripe='exp']”）val（））；
}否则{
var expMonth=$（“[data stripe='exp_month']”）val（）；
var expYear=$（“[data stripe='exp_year']”）val（）；
var valid=！Stripe.card.validateExpiry（expMonth，expYear）；
}
如果（有效）{
StripepayOnestepSubscriptionForm.bathror（表格“您的卡的到期月/年无效”）；
返回错误
}
var cvc=$（“输入[data stripe='cvc']”）val（）；
如果（！Stripe.card.validateCVC（cvc））{
StripepayOnestepSubscriptionForm.bathror（表格“您的卡的安全代码无效”）；
返回false；
}
返回true；
},
stripeResponseHandler:函数（表单、状态、响应）{
if（response.error）{
StripepayOnestepSubscriptionForm.batherRor（表单、响应、错误、消息）；
}否则{
var email=form.find（“[data stripepay='email']”）val（）；
var优惠券=form.find（“[data stripepay='优惠券']”）。val（）；
var quantity=form.find（“[data stripepay='quantity']”）。val（）；
var base_path=form.data（'stripepay-base-path'）；
var plan_type=表单数据（'stripepay-plan-type'）；
var plan_id=表单数据（'stripepay-plan-id'）；
var action=$（form.attr（'action'）；
表格.append（$（''）.val（计划类型））；
表格.附加（$（''）.val（计划id））；
form.append（$（''）.val（response.id））；
表格.附加（$（''）.val（电子邮件））；
表格.附加（$（''）.val（息票））；
追加（$（''）.val（数量））；
append（StripepayOnestepSubscriptionForm.authenticityTokenInput（））；
$.ajax({
类型：“POST”，
url:action，
数据：form.serialize（），
成功：功能（数据）{
StripepayOnestepSubscriptionForm.poll（表单，60，data.guid，基本路径）；
},
错误：函数（数据）{
StripepayOnestepSubscriptionForm.batherRor（表单，jQuery.parseJSON（data.responseText.error））；
}
});
}
},
轮询：函数（窗体、重试次数、guid、基本路径）{
if（num_retries_left==0）{
StripepayOnestepSubscriptionForm.batherRor（form，“这似乎花费的时间太长。请与支持人员联系，并为他们提供事务ID:”+guid）；
}
变量处理程序=函数（数据）{
如果（data.status==“活动”）{
window.location=base_path+/confirm_subscription/'+guid；
}否则{
setTimeout（函数（）{
poll（表单，num\u retries\u left-1，guid，基本路径）；
}, 500);
}
};
var errorHandler=函数（jqXHR）{
StripepayOnestepSubscriptionForm.batherRor（表单，jQuery.parseJSON（jqXHR.responseText.error））；
};
如果（guid的类型！=“未定义”）{
$.ajax({
键入：“GET”，
数据类型：“json”，
url:base_path+'/subscription_status/'+guid，
成功：handler，
错误：errorHandler
});
}
},
淋浴ROR：功能（表单、消息）{
$（'.stripepay微调器'）.css（'可见性'，'隐藏'）；
$（表单）.find（'div:submit'）
.prop（'disabled'，false）.change（）
.trigger（'错误'，消息）；
var error_selector=form.data（'stripepay-error-selector'）；
如果（错误选择器）{
$（错误选择器）。文本（消息）；
$（错误\选择器）.show（）；
}否则{
form.find（'.stripepay支付错误'）.text（消息）；
form.find（'.stripepay付款错误'）.show（）；
}
},
authenticityTokenInput:函数（）{
返回$（''）.val（$（'meta[name=“csrf token”]'）.attr（“内容”）；
}
};
StripepayOnestepSubscriptionForm.initialize（）；

显示错误验证消息后，提交按钮保持禁用状态。

'btn'，数据：{disable\u with:false}%>
<%= f.submit “Sign up”, :class => ‘btn’, data: {disable_with: false} %> 

---

允许JS控制按钮何时更改状态。（Rails 5）在默认情况下激活disable_。这是导致错误的原因。

您是否检查过是否确实调用了

showError

函数？该函数中的

$（form）.find（'div:submit'）

确实返回了预期的DOM元素吗？显示了错误消息，但我无法判断是否达到了该函数的代码。由于上面的代码是错误消息。如何调试淋浴ROR的方法块？在函数中放入

console.log

语句，并在浏览器控制台中查找它，或者设置brea