Question

我有一个包含Stripe JS的注册页面。用户填写完所有字段后，他们单击“提交”，除了错误，未发生任何事情Uncaught SyntaxError：控制台中位置0的JSON中的意外令牌<。如果然后我再次单击“提交”，它将按预期工作。我知道问题出在哪里，我只是不知道如何解决。 StripeToken不会附加在第一个“提交”上，而是附加在第二个上。

我尝试使用jQuery触发两次表单提交。我尝试将所有内容放入函数中并按顺序运行它们。据我自己（有限）的知识，我已经尽力了。

    document.getElementById("submitbtn").style.display = "none";
    var tabTitles = ['Let\'s get to know eachother...', 'We have to make sure...', 'Where\'s Wally?', 'Something to remember...', 'It\'s just business...'];
    var currentTab = 0;
    showTab(currentTab);

    function showTab(n) {
        var x = document.getElementsByClassName("tab");
        x[n].style.display = "block";
        if (n == 0) {
            document.getElementById("prevBtn").style.display = "none";
        } else {
            document.getElementById("prevBtn").style.display = "inline";
        }
        if (n == (x.length - 1)) {
            document.getElementById('submitbtn').style.display = "inline";
            document.getElementById("nextBtn").style.display = "none";
            document.getElementById("nextBtn").classList.add("initpayment");
        } else {
            document.getElementById("nextBtn").innerHTML = "Next";
            document.getElementById('submitbtn').style.display = "none";
            document.getElementById("nextBtn").style.display = "inline";
        }
        document.getElementById("tabTitle").innerHTML = tabTitles[n];
        fixStepIndicator(n);
    }

    function nextPrev(n) {
        var x = document.getElementsByClassName("tab");
        if (n == 1 && !validateForm())
            return false;
        x[currentTab].style.display = "none";
        currentTab = currentTab + n;
        showTab(currentTab);
    }
// TODO: Sort this- invalid class added but overridden by parent backgorund-color:none
    function validateForm() {
        var x, y, i, valid = true;
        x = document.getElementsByClassName("tab");
        y = x[currentTab].getElementsByTagName("input");
        for (i = 0; i < y.length; i++) {
            if (y[i].value == "") {
                y[i].className += " invalid";
                valid = false;
            }
        }
        if (valid) {
            document.getElementsByClassName("step")[currentTab].className += " finish";
        }
        return valid;
    }

    function fixStepIndicator(n) {
        var i, x = document.getElementsByClassName("step");
        for (i = 0; i < x.length; i++) {
            x[i].className = x[i].className.replace(" active", "");
        }
        x[n].className += " active";
    }

    var stripe = Stripe('<?php echo $StripePublishKey; ?>');
    var elements = stripe.elements();
    var card = elements.create('card');
    card.mount('#card-element');

    $(document).ready(function () {
        $(document.body).on('change', "#PID_select", function () {
            var optPrice = $("#PID_select option:selected").data('price');
            $('#charge_amount').empty().html(optPrice);
        });

        var form = document.getElementById('regForm');
        form.addEventListener('submit', function (e) {
            e.preventDefault();
            $('body').addClass('loading');

            stripe.createToken(card).then(function (result) {
                if (result.error) {
                    $('body').append('<div class="pgn-wrapper" data-position="bottom" style="left:0px;"><div class="pgn pgn-bar"><div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button><span>' + result.error.message + '</span></div></div></div>');
                } else {
                    $('[name="stripeToken"]').empty().val(result.token.id)
                }
            });

            var FData = $('#regForm').serializeArray();

            $.post('register', FData, function (registerReturn) {
                var $Return = JSON.parse(registerReturn);

                if ($Return.status === 'complete') {
                    window.location.replace('login?RD=3');
                } else if ($Return.status === '3d_required') {
                    var paymentIntentSecret = $Return.PIK;

                    stripe.handleCardPayment(paymentIntentSecret).then(function (result) {
                        if (result.error) {
                            $.post('register', {errorReg: true, token: $Return.token});
                            $('body').append('<div class="pgn-wrapper" data-position="bottom" style="left:0px;"><div class="pgn pgn-bar"><div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button><span>' + result.error.message + '</span></div></div></div>');
                            $('body').removeClass('loading');
                        } else {
                            $.post('register', {finishReg: true, token: $Return.token});
                            window.location.replace('login?RD=3');
                        }
                    });
                } else if ($Return.status === 'error') {
                    $('body').append($Return.response);
                    $('body').removeClass('loading');
                }
            });
            $('body').removeClass('loading');
        });
    });

首次尝试提交时出现错误消息：未捕获的SyntaxError：JSON中位置0的意外令牌<。

首次尝试的结果：无。第二次尝试的结果：符合预期

预期结果：第一次尝试提交时，stripe会生成令牌，并将其附加到表单中，然后提交将继续正常进行。

Answer 1

我不是乌拉圭回合代码，但是根据乌拉圭回合的称呼，这是怎么做的：

设置具有默认值的变量：

var numofclicks = 0;

现在在它下面，您只是添加了您应该在按钮上创建的onclick函数，以便尝试进行切换，例如，让我们设置功能clicked（）的名称，这样：

function clicked(){
 numofclick++;
 if(numofclicks = 1){
 //do stuff here
 }

 }

Answer 2

已解决。

resource "aws_cloudwatch_event_target" "data" {
  rule      = "${aws_cloudwatch_event_rule.scheduler.name}"
  target_id = "finance_producer_cloudwatch"
  arn       = "${aws_lambda_function.finance_data_producer.arn}"
  input     = "{\"test\": [\"111\"]}"
}

注册表+ Stripe JS-我必须单击两次提交

2 个答案: