如何根據選擇的復選框數量設置要在條紋按鈕上收費的金額

Question

更新/編輯：

我正在嘗試根據選中的復選框數為 Stripe 付款按鈕設置 $ 金額。 每個成本為 3 美元。 IE; 如果選中了“立即付款”按鈕，則會顯示“立即付款 $3”。 如果選中兩個，則立即支付按鈕將顯示立即支付 6 美元，依此類推。 我對 Rails 的經驗為零。 Stripe 實現此目的的文檔對我來說很陌生。 我只是不知道從哪里開始。 這是我到目前為止所擁有的：

<dl>
 <dt><div label id="mustcheck"><label for="cat1">1</label><input type="checkbox" name="cat1" id="cat1" class="categories" value="checkbox" onclick="get1()" /></dt>

    <dt><label for="cat2">2</label><input type="checkbox" name="cat2" id="cat2" class="categories" value="checkbox" onclick="get2()" /></dt>

    <dt><label for="cat3">3</label><input type="checkbox" name="cat3" id="cat3" class="categories" value="checkbox" onclick="get3()" /></dt>

    <dt><label for="cat4">4</label><input type="checkbox" name="cat4" id="cat4" class="categories" value="checkbox" onclick="get4()" /></dt>

    <dt><label for="cat5">5<input type="checkbox" name="cat5" id="cat5" class="categories" value="checkbox" onclick="get5()" /></div></dt>  

    Price: <strong>$<span name="total-price-view" id="total-price-view" value="">0</strong></span>

    <input type="submit" value="Subscribe" id="subscribe" name="subscribe" onclick=""/>

更新：我將在評論頁面上使用標准按鈕。 因此，我從@korben 的示例中獲取了代碼，並將其合並到我的注冊頁面中，如下所示（並在 html 表單中添加類和<span name="total-price-view> ）：

<script src="https://checkout.stripe.com/checkout.js"></script>
<script>

var pacs = document.getElementsByClassName("categories");

function attachEventListeners() {
for (var i = 0; i < pacs.length; i++) {
console.log('looping');
pacs[i].addEventListener('change', function (e) {
        var totalPrice = calculatePrice();
  document.getElementById('total-price-view').innerHTML = totalPrice;
    });
  }
}

function calculatePrice() {
var pricePerCheckbox = 3.00;  // $3.00
var totalChecked = 0;
for (var i = 0; i < pacs.length; i++) {
    if (pacs[i].checked) {
    totalChecked++;
     }
 }
var Totals = totalChecked * pricePerCheckbox;
return Totals;
}

 attachEventListeners();

  </script>

我現在需要做的是將該<span>的值發送到評論頁面。

我試過了：

<body onload="calculatePrice()">
Price: <strong>$<span name="total-price-view" id="total-price-view" value="return calculatePrice()">0</strong></span>

我也試過：

  document.getElementById('total-price-view').value = Totals;

Answer 1

我認為在這里做的最好的事情是為每個復選框提供一個特定的類（例如price-adjusted-checkbox ），您可以使用它在 Javascript 中引用它。 我在這里寫了一個如何做到這一點的例子：

https://jsfiddle.net/a6cvd5px/9/

您將向它們附加一個事件偵聽器以偵聽更改，然后在發生更改時觸發重新計算。 然后重新計算可以轉到您的.open() 。

如何根據選擇的復選框數量設置要在條紋按鈕上收費的金額

問題描述

1 個解決方案

解決方案1
1 已采納 2019-01-22 21:28:39

如何根據選擇的復選框數量設置要在條紋按鈕上收費的金額

問題描述

1 個解決方案

解決方案1 1 已采納 2019-01-22 21:28:39

解決方案1
1 已采納 2019-01-22 21:28:39