Question

作为我的第一个项目之一，我正在制作一个表格来计算＆＃34;钱带＆＃34;通过使用选定的表格＆＃34;输入=＆＃39; radio＆＃39;＆＃34;。我想要做的是选择输入并在＆＃34;购买＆＃34;按钮被选中。我想这将需要一个函数来使这成为可能我只是不知道从哪里开始以及如何将值实现到此计算中。我唯一知道的是数学应该是＆＃34;（denom * strap）* times＆＃34;。任何开始的地方都将非常感激。提前谢谢，如果我不够具体，我很抱歉，但我希望我能理解的是。截至目前，我没有只用HTML设置编写的javascript。

<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;
}

Answer 1

尝试以下解决方案，

＆＃13;

<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>

＆＃13;

Answer 2

这样做：

var form = document.getElementById("strapDenom");
alert(form.elements["denom"].value);
var denom = form.elements["denom"].value;
var strap= form.elements["strap"].value;
var times= form.elements["times"].value;
var multiple = denom*strap*times;

Answer 3

我认为你自己的功能是对的，你只需添加即可 var result = denom*strap*times 并且result应该包含您的结果。将您的OP或您想要对结果做的任何事情添加到函数中，在HTML顶部添加函数，例如在您的表单正上方，并在按钮中触发您的功能。

使用按钮计算表单的值

3 个答案: