我一直在嘗試自動(dòng)計(jì)算所選單選按鈕的總和。單選按鈕的值來(lái)自數(shù)據(jù)庫(kù)。這是我到目前為止所嘗試過(guò)的。它僅適用于第一個(gè)模式。這是手動(dòng)刺激數(shù)據(jù)的片段的鏈接。https://jsfiddle.net/k5zh9m4d/1/<section class="py-5"> <div class="container"> <h1 class="display-4">Menu</h1> <?php include "config/dbconfig.php"; $data['productCode'] = "0"; // sample data $stmt = $conn->prepare("SELECT * FROM tbl_products"); //$stmt->bind_param("i", $data['productCode']); $stmt->execute(); foreach ($stmt->get_result() as $i => $stuff) { ?> <div class="row"> <div class="col-6"> <img src="<?php echo $stuff['image']; ?>" class="img-fluid" alt="Sample milk tea"> </div> <div class="col"> <h3><?php echo $stuff['itemname']; ?></h3> <p><?php echo $stuff['itemdescription']; ?></p> <hr> <h4> <button type="button" class="btn btn-secondary btn-lg" disabled> <i class="fa fa-glass fa-lg" aria-hidden="true"></i> <?php echo $stuff['itempricethree']; ?> </button> </h4> <br> <hr> <button type="button" class="btn btn-outline-danger btn-lg" data-toggle="modal" data-target="#<?php echo $stuff['itemcode']; ?>"> <i class="fa fa-cart-plus" aria-hidden="true"></i> Order </button> </div> </div> <br><br>
2 回答
慕田峪9158850
TA貢獻(xiàn)1794條經(jīng)驗(yàn) 獲得超8個(gè)贊
您有兩個(gè)spanid 為 的元素total。因此，第二個(gè)模態(tài)的總值顯示在第一個(gè)模態(tài)中，因?yàn)檫@是totalDOM 中第一個(gè) id 的元素。
為您的總跨度指定一個(gè)類而不是 ID，然后搜索form與單擊的單選按鈕最接近的。span然后求出屬于它的總數(shù)。
此外，由于一次只能有一個(gè)單選按鈕處于活動(dòng)狀態(tài)，因此無(wú)需遍歷所有單選按鈕。只需輸出所選無(wú)線電輸入的值即可。
$(":radio").on("change", function(){
$(this).closest('form').find('.total').text(Number(this.value));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="#" id="orderform">
<div class="modal-body">
<b>Size</b> <small>Pick 1</small>
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="rbtn1" value="10.00">
<label class="form-check-label" for="rbtn1">Regular - PHP 10.00</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="rbtn2" value="20.00">
<label class="form-check-label" for="rbtn2">Large - PHP 20.00</label>
</div>
<p>Total: PHP <span class="total">0</span></p>
</div>
</form>
<form action="#" id="orderform">
<div class="modal-body">
<b>Size</b> <small>Pick 1</small>
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="rbtn3" value="30.00">
<label class="form-check-label" for="rbtn3">Regular - PHP 30.00</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="rbtn4" value="40.00">
<label class="form-check-label" for="rbtn4">Large - PHP 40.00</label>
</div>
<p>Total: PHP <span class="total">0</span></p>
</div>
</form>
翻翻過(guò)去那場(chǎng)雪
TA貢獻(xiàn)2065條經(jīng)驗(yàn) 獲得超14個(gè)贊
我無(wú)法測(cè)試這段代碼，但這是想法，你可以嘗試一下。
<input
onChange="calc(this,<?php $forsize['id']; ?>)"
class="form-check-input"
type="radio"
name="radiobutton"
id="rbtn2"
value="10.00">
然后
<p>Total: PHP <span id="total-<?php echo $forsize['id']; ?>">0</span></p>
和
<script>
function calc(el, id) {
var value = el.value;
//do the formula then emit the answer to the span total with id
}
</script>
- 2 回答
- 0 關(guān)注
- 150 瀏覽
添加回答
舉報(bào)
0/150
提交
取消