Javascript 从输入字段设置变量

我有一个表单，其中包含电子邮件地址的输入字段。表单没有“提交”按钮。相反，它有Stripe

checkout.js

脚本，该脚本提供一个按钮，在提交表单之前触发Stripe的往返（以处理信用卡）。

checkout.js

脚本允许一个可选变量

data-email

，它可以将预设的电子邮件地址传递给条带签出表单。我想在我自己的表单上用email address输入字段的值设置

data email

变量

以下是表格和脚本：

<form role="form" class="new_user" id="new_user" action="/users" method="post">
    <label for="user_email">Email</label>
    <input class="form-control" type="email" value="" name="user[email]" id="user_email" />
   <script src="https://checkout.stripe.com/v2/checkout.js"
       class="stripe-button"
       data-email=document.getElementById('user_email').value
       data-key="stripe_key"
       data-description="Product"
       data-amount="500">
   </script>
</form>

电子邮件

我知道我需要使用：

数据电子邮件=document.getElementById（'user_email'）。值

---

但是

数据电子邮件

没有设置。是否需要在输入字段中添加

onchange

属性？那会是什么样子？我还需要更多吗？

如果用户在页面上输入他的电子邮件，您不妨在他们键入时更新脚本：

var stripe=document.getElementById（“stripe”）；
document.getElementById（“电子邮件”）.onkeypress=function（）{
stripe.setAttribute（“数据电子邮件”，this.value）；
}

您能给我看一个与提供的代码一起工作的JSFIDLE吗？我可以看到您的代码修改了脚本中的数据电子邮件属性。但是，一旦加载脚本，虽然属性可以更改，但原始值仍然被使用，更改被忽略。@DanielKehoe我一直在尝试，但我没有API密钥（我不确定这是否会影响电子邮件的传递方式）。无论哪种方式，你都不必向stripe发送电子邮件。这是一个可选字段，意味着用户可以在加载条带模式时键入它。谢谢@royhowie，我认为您不需要API密钥来测试代码。我知道电子邮件数据属性是可选的。我正在创建一个注册表单（Rails Desive），其中用户输入一个电子邮件地址（和密码），然后单击“用卡支付”，我不希望用户输入两次电子邮件地址，因此我尝试从注册表单的输入字段更新脚本中的电子邮件数据属性。但是，在这一点上，我认为这是不可能的，因为一旦加载脚本，电子邮件数据属性就会设置，并且对脚本的更改就会被忽略。@DanielKehoe如果用户正在登录，一旦服务器确认了脚本元素的信息，您就可以使用正确的信息动态插入脚本元素。再次感谢您的想法。在这个用例中，用户进行支付并同时创建一个新的用户帐户。我已经实现了一个分两步的过程，用户填写注册表单，页面刷新并设置电子邮件数据属性（如您所建议的），然后用户单击“用卡支付”。我希望通过JavaScript更改变量实现这一步骤，但由于脚本在页面加载时运行，这似乎不起作用。可能重复