Recurly.js插入带有巨大空白区域的iFrame。 API Key没有错误,我在正确的位置插入了“https://js.recurly.com/v4/recurly.js”。我所有的div都被iFrames取代,但它们只是显示为空格。什么被替换为。
<div data-recurly="number">
<div class="recurly-hosted-field recurly-hosted-field-number">
<iframe src="https://api.recurly.com/js/v1/field.html#config=%7B%22type%22%3A%22number%22%2C%22selector%22%3A%22%5Bdata-recurly%3Dnumber%5D%22%2C%22style%22%3A%7B%7D%2C%22recurly%22%3A%7B%22currency%22%3A%22USD%22%2C%22timeout%22%3A60000%2C%22publicKey%22%3A%22ewr1-bLIWZt0VgjgKdetoJyJ5yM%22%2C%22parent%22%3Atrue%2C%22parentVersion%22%3A%224.5.2%22%2C%22cors%22%3Atrue%2C%22fraud%22%3A%7B%22kount%22%3A%7B%22dataCollector%22%3Afalse%7D%2C%22litle%22%3A%7B%22sessionId%22%3Anull%7D%7D%2C%22api%22%3A%22https%3A%2F%2Fapi.recurly.com%2Fjs%2Fv1%22%2C%22fields%22%3A%7B%22all%22%3A%7B%22style%22%3A%7B%7D%7D%2C%22number%22%3A%7B%22selector%22%3A%22%5Bdata-recurly%3Dnumber%5D%22%2C%22style%22%3A%7B%7D%7D%2C%22month%22%3A%7B%22selector%22%3A%22%5Bdata-recurly%3Dmonth%5D%22%2C%22style%22%3A%7B%7D%7D%2C%22year%22%3A%7B%22selector%22%3A%22%5Bdata-recurly%3Dyear%5D%22%2C%22style%22%3A%7B%7D%7D%2C%22cvv%22%3A%7B%22selector%22%3A%22%5Bdata-recurly%3Dcvv%5D%22%2C%22style%22%3A%7B%7D%7D%7D%2C%22required%22%3A%5B%5D%7D%7D" border="0" frameborder="0" allowtransparency="true" scrolling="no" style="height: 100%; width: 100%; background: transparent;">
</iframe>
</div>
</div>
不知道从哪里开始,因为它没有显示任何错误。
答案 0 :(得分:0)
我认为你需要他们的CSS来处理这个问题。试试
.recurly-hosted-field {
position: relative;
width: 100%;
height: 42px;
border: 2px solid #c2c2c2;
background: transparent;
padding: 0.5rem;
margin: 0 0 1rem;
outline: none;
font-family: 'Open Sans', Helvetica, sans-serif;
font-size: 1rem;
font-weight: bold;
box-shadow: none;
border-radius: 0;
color: #c2c2c2;
-webkit-appearance: none;
-webkit-transition: border-color 0.3s;
-moz-transition: border-color 0.3s;
-ms-transition: border-color 0.3s;
-o-transition: border-color 0.3s;
transition: border-color 0.3s;
}
.recurly-hosted-field-focus {
border-color: #2c0730;
color: #2c0730;
z-index: 10;
}