HTML表单计算

Question

我试图用HTML制作订单。
当我在空白页面中尝试此代码时，它的工作非常完美。

<input type="number" id="c" value="1"> Drink 1L €40.00 <input type="hidden" id="d" value="40"> Total €<output name="z" for="c d"></output>

当我将其粘贴到订单表格中时，输出不会显示。 这是订单的总代码。有人可以告诉我它为什么在空白页面上工作，而不是在总代码中？

  <h1 class="headerhd">bestelformulier</h1>
  <div id="bedrijfsinfo" class="clearfix">
    <div>Company</div>
    <div>Adress<br/> Zipcode</div>
    <div>Phonenumber</div>
    <div><a href="mailto:mail">Mail</a></div>
  </div>
  <div id="hdklantgegevens">
    <div><span>Naam</span> $name</div>
    <div><span>Straat</span> $street</div>
    <div><span>Postcode</span> $zipcode, $place</div>
    <div><span>Telefoon</span> $telephone</div>
    <div><span>E-mail</span> <a href="mailto:$email">$email</a></div>
    <div><span>Datum</span> $datum</div>
  </div>
</header>
<main>
  <table>
    <thead>
      <tr>
        <th class="service">Aantal</th>
        <th class="desc">Product</th>
        <th>Prijs per stuk</th>
        <th>Totaalprijs</th>
      </tr>
    </thead>
    <tbody>
    <form oninput="x.value=parseInt(a.value)*parseInt(b.value)">
      <tr>
        <td class="service"><input type="number" id="a" value="1"> </td>
        <td class="desc">drink 500ml</td>
        <td class="unit">€20.00<input type="hidden" id="b" value="20"></td>
        <td class="total">€<output name="x" for="a b"></output></td>
      </tr>
    </form>
      <tr>
        <td colspan="3">Subtotaal</td>
        <td class="total">€Subtotaal</td>
      </tr>
      <tr>
        <td colspan="3">BTW 21%</td>
        <td class="total">€BTW bedrag</td>
      </tr>
      <tr>
        <td colspan="3" class="grand total">Totaalprijs</td>
        <td class="grand total">€Totaalprijs</td>
      </tr>
    </tbody>
  </table>
  <div id="notices">
    <div>Belangrijk:</div>
      <div class="notice">U krijgt een automatische mail dat u bestelling is aangekomen.</br>
Wanneer u uw bestelling kan ophalen krijgt u hier vanzelf bericht over.</div>
  </div>
</main>

Answer 1

您可以将其与您的代码一起使用;

<form oninput="x.value=parseInt(a.value)*parseInt(b.value)"> 
YOUR CODE ...
</form>

我的意思是;

<form oninput="x.value=parseInt(a.value)*parseInt(b.value)">
      <h1 class="headerhd">bestelformulier</h1>
      <div id="bedrijfsinfo" class="clearfix">
        <div>Company</div>
        <div>Adress<br/> Zipcode</div>
        <div>Phonenumber</div>
        <div><a href="mailto:mail">Mail</a></div>
      </div>
      <div id="hdklantgegevens">
        <div><span>Naam</span> $name</div>
        <div><span>Straat</span> $street</div>
        <div><span>Postcode</span> $zipcode, $place</div>
        <div><span>Telefoon</span> $telephone</div>
        <div><span>E-mail</span> <a href="mailto:$email">$email</a></div>
        <div><span>Datum</span> $datum</div>
      </div>
    </header>
    <main>
      <table>
        <thead>
          <tr>
            <th class="service">Aantal</th>
            <th class="desc">Product</th>
            <th>Prijs per stuk</th>
            <th>Totaalprijs</th>
          </tr>
        </thead>
        <tbody>
        <form oninput="x.value=parseInt(a.value)*parseInt(b.value)">
          <tr>
            <td class="service"><input type="number" id="a" value="1"> </td>
            <td class="desc">Hagel en Donder 500ml</td>
            <td class="unit">€20.00<input type="hidden" id="b" value="20"></td>
            <td class="total">€<output name="x" for="a b">0</output></td>
          </tr>
        </form>
          <tr>
            <td colspan="3">Subtotaal</td>
            <td class="total">€Subtotaal</td>
          </tr>
          <tr>
            <td colspan="3">BTW 21%</td>
            <td class="total">€BTW bedrag</td>
          </tr>
          <tr>
            <td colspan="3" class="grand total">Totaalprijs</td>
            <td class="grand total">€Totaalprijs</td>
          </tr>
        </tbody>
      </table>
      <div id="notices">
        <div>Belangrijk:</div>
          <div class="notice">U krijgt een automatische mail dat u bestelling is aangekomen.</br>
    Wanneer u uw bestelling kan ophalen krijgt u hier vanzelf bericht over.</div>
      </div>
    </main>
    </form>