作为我的第一个项目，我正在制作一个表格，通过使用选定的表格“type='radio'”来计算“资金带”。我想做的是在选择“购买”按钮时获取选定的输入并计算它们。我想需要一个函数才能实现这一点，我只是不知道从哪里开始以及如何将这些值实现到这个计算中。我唯一知道的是数学应该是“(面额*带)*倍”。任何可以开始的地方将不胜感激。提前致谢，如果我说得不够具体，抱歉，但我希望我想要做的事情能够被理解。截至目前，我还没有编写 JavaScript，只是 HTML 设置。
<html>
<head>
<h1 id='header'>
<b>BUY MONEY</b>
</h1>
</head>
<body id='body'>
<form id='strapDenom'>
<p id='p1'>
<b>DENOMINATION</b>
</p>
<input type='radio' name='denom' value='100' checked> 1's<br>
<input type='radio' name='denom' value='200'> 2's<br>
<input type='radio' name='denom' value='500'> 5's<br>
<input type='radio' name='denom' value='1000'> 10's<br>
<input type='radio' name='denom' value='2000'> 20's<br>
<input type='radio' name='denom' value='1000'> 50's<br>
<input type='radio' name='denom' value='1000'> 100's<br>
</form>
<form id='strapCount'>
<p id='p2'>
<b>STRAP COUNT</b>
</p>
<input type='radio' name='strap' value='1' checked> 1<br>
<input type='radio' name='strap' value='2'> 2<br>
<input type='radio' name='strap' value='3'> 3<br>
<input type='radio' name='strap' value='4'> 4<br>
<input type='radio' name='strap' value='5'> 5<br>
<input type='radio' name='strap' value='6'> 6<br>
<input type='radio' name='strap' value='7'> 7<br>
<input type='radio' name='strap' value='8'> 8<br>
<input type='radio' name='strap' value='9'> 9<br>
<input type='radio' name='strap' value='10'> 10<br>
</form>
<form id='multiply'>
<p id='p3'>
<b>MULTIPLE</b>
</p>
<input type='radio' name='times' value='1' checked> 1<br>
<input type='radio' name='times' value='2'> 2<br>
<input type='radio' name='times' value='3'> 3<br>
<input type='radio' name='times' value='4'> 4<br>
<input type='radio' name='times' value='5'> 5<br>
<input type='radio' name='times' value='6'> 6<br>
<input type='radio' name='times' value='7'> 7<br>
<input type='radio' name='times' value='8'> 8<br>
<input type='radio' name='times' value='9'> 9<br>
<input type='radio' name='times' value='10'> 10<br>
</form>
<br>
<button id='buy' onclick=''>BUY</button>
</body>
</html>
我会用这样的东西吗？
function buyMoney() {
var den = document.getElementById('denom').value;
var str = document.getElementById('strap').value;
var tim = document.getElementById('times').value;
document.getElementById('buy').innerHTML = den * str * tim;
}
最佳答案
尝试使用以下解决方案，
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1 id='header'>
<b>BUY MONEY</b>
</h1>
<script>
function calculate() {
var denom = $("input[name='denom']:checked").val();
var strap = $("input[name='strap']:checked").val();
var times = $("input[name='times']:checked").val();
var finalPrice = (denom * strap) * times;
$("#iblFinalPrice").html(finalPrice);
}
</script>
</head>
<body id='body'>
<form id='strapDenom'>
<p id='p1'>
<b>DENOMINATION</b>
</p>
<input type='radio' name='denom' value='100' checked> 1's<br>
<input type='radio' name='denom' value='200'> 2's<br>
<input type='radio' name='denom' value='500'> 5's<br>
<input type='radio' name='denom' value='1000'> 10's<br>
<input type='radio' name='denom' value='2000'> 20's<br>
<input type='radio' name='denom' value='1000'> 50's<br>
<input type='radio' name='denom' value='1000'> 100's<br>
</form>
<form id='strapCount'>
<p id='p2'>
<b>STRAP COUNT</b>
</p>
<input type='radio' name='strap' value='1' checked> 1<br>
<input type='radio' name='strap' value='2'> 2<br>
<input type='radio' name='strap' value='3'> 3<br>
<input type='radio' name='strap' value='4'> 4<br>
<input type='radio' name='strap' value='5'> 5<br>
<input type='radio' name='strap' value='6'> 6<br>
<input type='radio' name='strap' value='7'> 7<br>
<input type='radio' name='strap' value='8'> 8<br>
<input type='radio' name='strap' value='9'> 9<br>
<input type='radio' name='strap' value='10'> 10<br>
</form>
<form id='multiply'>
<p id='p3'>
<b>MULTIPLE</b>
</p>
<input type='radio' name='times' value='1' checked> 1<br>
<input type='radio' name='times' value='2'> 2<br>
<input type='radio' name='times' value='3'> 3<br>
<input type='radio' name='times' value='4'> 4<br>
<input type='radio' name='times' value='5'> 5<br>
<input type='radio' name='times' value='6'> 6<br>
<input type='radio' name='times' value='7'> 7<br>
<input type='radio' name='times' value='8'> 8<br>
<input type='radio' name='times' value='9'> 9<br>
<input type='radio' name='times' value='10'> 10<br>
</form>
<br>
<div> <b>Total Price :</b> <label id="iblFinalPrice"></label></div>
<br>
<button id='buy' onclick='calculate()'>BUY</button>
</body>
</html>关于javascript - 使用按钮计算表单的值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50383268/