如何在不更改 select 框值的情況下選擇選擇框時更改 html 中的輸入框值

Question

我正在嘗試將 payu 支付網關集成到我的網站中，因此當用戶在我的表單中選擇產品信息時，金額應相應更改，我已完成以下操作：

 function myFunction(e) { document.getElementById("myText").value = e.target.value }

 <select name="productinfo" onchange="myFunction(event)" class="form-control"> <option value="<?php echo (empty($posted['productinfo']))? '': $posted['productinfo']; ?>" disabled selected>Choose Database Type</option> <option value="26,999">X 1.5</option> <option value="28,999">X 2.5</option> <option value="32,999">X 3.5</option> <option value="35,999">X 4.5</option> </select> <input type="text" name="amount" id="myText" class="form-control" value="<?php echo (empty($posted['amount']))? '': $posted['amount']; ?>" readonly>

這里的金額正在根據產品 select 進行更改，我可以通過它來支付，我想要的是產品信息也像 value="X2" 一樣在表單中傳遞，有什么辦法可以做到這一點，請幫助， 提前致謝

Answer 1

在這里試試這個：

 function myFunction(e) { document.getElementById("myText").value = e.options[e.selectedIndex].getAttribute('data-price'); }

 <select name="productinfo" onchange="myFunction(this)" class="form-control"> <option value="<?php echo (empty($posted['productinfo']))? '': $posted['productinfo']; ?>" disabled selected>Choose Database Type</option> <option value="X 1.5" data-price="26,999">X 1.5</option> <option value="X 2.5" data-price="28,999">X 2.5</option> <option value="X 3.5" data-price="32,999">X 3.5</option> <option value="X 4.5" data-price="35,999">X 4.5</option> </select> <input type="text" name="amount" id="myText" class="form-control" value="<?php echo (empty($posted['amount']))? '': $posted['amount']; ?>" readonly>