在提交表单时更新 <script> 元素答案

【问题标题】：Updating a <script> element on form submission在提交表单时更新 <script> 元素
【发布时间】：2014-03-12 01:08:48
【问题描述】：

我正在使用 Stripe 进行支付处理，它在 <form> 元素中使用内联 <script></script>，如下所示：

<form action="" method="POST" id="payButton" style="display:none;">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="myprivatekeygoeshere"
    data-amount="4900"
    data-name="Sample Name"
    data-description="We use Stripe for 100% secure payment processing."
    data-image="/agm-128-128.png"
    data-email="THIS IS WHAT I'D LIKE TO CHANGE"
  </script>
</form>

此表单是两部分验证的第 2 步。第一个获取用户的信息，例如姓名、电子邮件地址、位置并将其保存到我的服务器。一旦发生这种情况，就会打开这个 Stripe 表单。

在脚本中，有一个data-email 选项。这会自动填充用户的电子邮件地址，我想根据用户在表单的step 1 中的输入来更新它。

使用 Javascript 或 jQuery，有没有可能做到这一点？

类似的东西：

$('#form1').submit(function(){
  var email = $('#form1 #email').val();
  $('#payButton script').attr('data-email', email);
});

这个问题的可能重复项没有正确的解决方案并且已经 3 年了：jQuery > Update inline script on form submission

【问题讨论】：

您是在问是否可以在提交后但在解决之前修改表单？如果是这样，答案是可以的，只需在 jQuery 的 submit() 事件处理程序中使用 preventDefault()。
不，我要求在提交表单 #1 后更新位于表单 #2 内的内联 <script> 标记的 data-email 属性。
您发布的代码是否符合您的要求？如果没有，您希望它做些什么不同的事情？
@probackpacker 这很尴尬。为了快速了解我想要做什么，我发布了一些我确定不会工作的代码 - 但它确实有效！我确信你不能用 jQuery 来定位 <script> 标签，但我想我错了。为证明我在 jQuery 方面比我自己认为的更好的探索性问题欢呼！

标签： javascript jquery forms stripe-payments

【解决方案1】：

答案很滑稽/愚蠢地出现在问题中 - 感谢@probackpacker，他让我测试了我发布的虚拟代码作为不起作用的示例。它确实有效：

$('#form1').submit(function(){
  var email = $('#form1 #email').val();
  $('#payButton script').attr('data-email', email);
});

这会正确定位 <script> 标记并允许您更改属性。

【讨论】：