Javascript / Jquery 将变量拆分为两个以进行条带集成

Posted 2023-02-22

【中文标题】Javascript / Jquery 将变量拆分为两个以进行条带集成

【英文标题】：Javascript / Jquery Split Variable Into Two for Stripe Integration

【发布时间】：2013-11-16 14:08:46

【问题描述】：

我提前道歉，因为我对 php 相当熟悉，但是当涉及到 javascript 和 jquery 时，我真的有点无能为力。我有以下代码，我从此处找到的示例中编辑了 https://gist.github.com/boucher/1750375，并希望将信用卡 exp 月份和年份字段合并为一个。问题是将它们分开以与创建令牌的条带示例代码一起使用。显然 github 上的示例运行良好，但是当我尝试编辑时，脚本并没有表现出任何错误，但没有像以前一样提交条带化和检索令牌。

$(document).ready(function() 
            $("#payment-form").submit(function(event) 
                // disable the submit button to prevent repeated clicks
                $('.submit-button').attr("disabled", "disabled");
                var expgroup = document.getElementById('date-exp').val;
                var expArray = expgroup.split( '/' );
                var expmm = ( expArray[ 0 ] );
                var expyy = ( expArray[ 1 ] );
                // createToken returns immediately - the supplied callback submits the form if there are no errors
                Stripe.createToken(
                    number: $('.cc').val(),
                    cvc: $('.card-cvc').val(),
                    exp_month: expmm,
                    exp_year: expyy
                , stripeResponseHandler);
                return false; // submit from callback
            );
        );

【问题讨论】：

补充一点，过期字段的组合 id 是 date-exp，这是用户输入类似 10/2014 的地方。目标是用 / 分隔并将 exp_month 和 exp_year 设置为 stripe.createToken 部分中的正确值

您是否尝试写入以记录您发送的信息？看看数据是否被检索？

cc 和 carc-cvc real 是类吗？如果不查看其余代码，很难找到问题。请同时发布您的 html

【参考方案1】：

这行不通。

var expgroup = document.getElementById('date-exp').val;

改用这个：

var expgroup = $("#date-exp").val()

“cc”也是 id 而不是类。 你需要使用：

$("#cc").val()

而不是：

$(".cc").val()

【参考方案2】：

document.getElementById('date-exp').val

是 jQuery 和 DOM 的混合体。它应该是：

document.getElementById('date-exp').value

或：

$('#date-exp').val()

还要考虑检查 / 是否确实在值中（即 expArray.length===2）。

【讨论】：

使用 document.getElementById('date-exp').value 使表单再次正常工作，但是我收到卡号无效的错误。这认为这是因为它没有为到期月份和年份正确分配正确的数字？对不起，我又在 javascript / jquery 方面太糟糕了！

对您在表单中发送的每个变量使用 console.log，以验证您是否获得了预期的值。

见下面我的回答。 “cc”是 id 而不是类

【参考方案3】：

Stripe 的 jquery.payment 库已经内置了这个函数：

https://github.com/stripe/jquery.payment#paymentcardexpiryvalstring-and-fnpaymentcardexpiryval

这里有一些示例代码。

# form fields on HTML.ERB page
<%= form_tag url do %>
  <%= text_field_tag :expiry, nil, name: nil, placeholder: "MM / YYYY", size: 9, id: "stripe-card-expiry" %>
  <%= hidden_field_tag :exp_month, nil, name: nil, id: "stripe-card-exp-month", data:  stripe: "exp-month"  %>
  <%= hidden_field_tag :exp_year, nil, name: nil, id: "stripe-card-exp-year", data:  stripe: "exp-year"  %>
  ...other fields and submit...
<% end %>

# Split single expiration field into month/year
expiration = $("#stripe-card-expiry").payment("cardExpiryVal") # => month: "value", year: "value"
$("#stripe-card-exp-month").val(expiration.month || 0)
$("#stripe-card-exp-year").val(expiration.year || 0)

# Submit to Stripe.com and get token
Stripe.card.createToken($("#form-id"), handleStripeResponse)

根据您使用的 Stripe.js 版本，如果您使用“data-stripe...”项，Stripe.js 将自动从隐藏字段中获取值。