javascript - 使用 Javascript 设置元素参数

Question

我正在尝试设置 <script> 的参数值使用 Javascript 值的元素。使用 Stripe checkout.js 可以使用参数设置电子邮件框的值，并且它要求用户电子邮件的位置位于页面上的其他位置，因此我需要获取该文本框的值并将其发送到该参数值，如下所示:

<form action="charge.php" method="post">
    <center>
      <div class="form-group">
        <label for="inputEmail" class="col-lg-2 control-label">Email</label>
        <div class="col-lg-10">
          <input class="form-control" id="inputEmail" name="inputEmail" type="text" maxlength="64" data-validation="email" placeholder="donator@example.com">
        </div>
      </div><br><br>
      <input type="range" min="1" max="100" value="5" step="1" name="inputAmount" id="inputAmount" onchange="updateBox(this.value)">
      <span class="pull-right"><input type="tel" maxlength="3" id="inputAmountText" name="inputAmountText" class="form-control" value="5" onchange="updateSlider(this.value)"></span>
    </center>
    <br><br><br>
    <script src="https://checkout.stripe.com/checkout.js" class="stripe-button"
      data-key="<?php echo $stripe['publishable_key']; ?>"
      data-description="Donation"
      data-email="$('#inputEmail').val();"
      data-image="https://joshstroup.me/global/img/avatar.png"
      data-name="Joshua Stroup"
      data-zip-code="true"
      data-panel-label="Donate"
      data-label="Proceed To Payment"></script>
  </form>

注意我设置的位置 data-email至$('#inputEmail').val(); ，这就是(我认为)完成的方式，但是当我打开结账表单时，该框是空白的，并显示占位符，所以我不太确定如何正确设置它。

Answer 1

我认为您尝试做的事情是不正确的。

假设您展示的方法会以某种方式起作用:

• 当页面首次加载时，#inputEmail 的值为 null，因此您使用 null 参数加载脚本。
• 在表单发布中，我认为您将清除表单值，并且脚本会使用空参数再次加载。

如果您仍然想按照自己的方式进行操作，请查看如何自动生成脚本标签: How to dynamically insert a <script> tag via jQuery after page load?