JSFiddle - React, Tailwind, and code Playground
HTML
<div id="header" align="center" > <h3> Заказ пончиков </h3> </div>
<div id="left">
<img src=" rock.jpg" alt="Smile" />
<form name="Orderform" action="donutes.php" method="POST">
<div class="field">
Чиcло пончиков:<input type="text" id="cakedonuts"
name="cakedonuts" value="" onchange="UpdateOrder();"/>
</div>
<div class="filed">
Глазурованных: <input type="text" id="glazeddonats"
name="glazeddonats" value="" onchange="UpdateOrder();"/>
</div>
<div class="filed">
Subtotal: <input type="text" id="subtotal"
name="glazeddonats" value="" onchange="UpdateOrder();"/>
</div>
<div class="filed">
<input type="button" value="Сделат заказ" onclick="placeOrder(this.form);"/>
</div>
</form>
</div>
JavaScript
function UpdateOrder(){
const TAXRATE=0.0925
const DONUTPRICE=0.50
var numCakeDonuts=parseInt(document.getElementById("cakedonuts").value);
var numGlazaDonuts=parseInt(document.getElementById("glazeddonats").value);
if (isNaN(numCakeDonuts))numCakeDonuts=0;
if (isNaN(numGlazaDonuts))numGlazaDonuts=0;
var subTotal=(numCakeDonuts+numGlazaDonuts)*DONUTPRICE;
var tax=subTotal*TAXRATE;
var total=tax+subTotal;
document.getElementById("subtotal").value="$"+subTotal.toFixed(2);
document.getElementById("tax").value="$"+tax.toFixed(2);
document.getElementById("total").value="$"+total.toFixed(2);
}
function placeOrder () {
form.submit(); }