私のチームはRecurly.jsを使用してウェブサイトに支払いページを作成しています。私たちはhttps://docs.recurly.com/jsの文書に従っています。ドキュメントによると、div要素を含むRecurly.jsフォームを作成するにはどうすればよいですか?
好きなフォームを作成します。 recurly.jsへの入力フィールドターゲットを識別するには、data-recurly属性を使用します。 Recurly.jsがカードデータフィールドをどこに注入するかを特定するには、単純なdiv要素の使用をお勧めします。
問題は、div
要素が実際にフォームに表示されないことです。ここではドキュメントのオフに基づいて、ショート再現性の例です:
<!doctype html>
<html lang="en">
<head>
<!-- Recurly.js script and API key config -->
<script src="https://js.recurly.com/v4/recurly.js"></script>
<script>recurly.configure('... API Key here...');</script>
</head>
<body>
<form>
<input type="text" data-recurly="first_name">
<input type="text" data-recurly="last_name">
<div data-recurly="number"></div>
<div data-recurly="month"></div>
<div data-recurly="year"></div>
<div data-recurly="cvv"></div>
<input type="hidden" name="recurly-token" data-recurly="token">
<button>submit</button>
</form>
</body>
</html>
これは、それがどのように見えるかです:
あなたが見ることができるように、2つのinput
sが罰金を示していないが、のどれもdiv
が正しく表示されます。
私たちは間違って何をしていますか、どのようにdiv
要素でRecurly.jsフォームを作成しますか?