以最小订单实时计算表格答案

【问题标题】：Real time calculation of form with minimum order以最小订单实时计算表格
【发布时间】：2019-11-01 16:53:27
【问题描述】：

我从两个不同的来源借用了一些代码并将它们拼接在一起。一个有效（订购总数），但第二个（最小订单）无效。我是 Java 新手，可能只是缺少命令或其他东西。

'total' 用于两者，一旦 'total' 大于 20，应该重新启用提交按钮。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>temp</title>

<script language="javascript">
function calculate(form)
{
var item1 = form.item1.value;
var item2 = form.item2.value;
form.total.value = (item1 * 10) + (item2 * 30);
};
</script>

<script language="javascript">
setInterval(function () {
    if ($('#total').val() >= 20)
        $(":submit").removeAttr("disabled");
    else
        $(":submit").attr("disabled", "disabled");
}, 1);
</script>

</head>
<body>
<form method="POST" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" >
<table border="1" cellspacing="1" width="757">
<tr>
<td width="224" align="center"><strong>Quantity</strong></td>
<td width="39" align="center"><strong>price</strong></td>
<td width="476" align="center"><strong>total</strong></td>
</tr>
<tr>
<td width="224">item1<input type="number" name="item1" size="20" onchange="calculate(this.form)" value="0"></td>
<td width="39">$10</td>

</tr>
<tr>
<td width="224">item2<input type="number" name="item2" size="20" onchange="calculate(this.form)" value="0"> </td>
<td width="39">$30</td>
</tr>
<tr>
<td width="224"> </td>
<td width="39">total</td>
<td width="476"> <input type="number" name="total" size="20"></td>
</tr>
</table>
<p><input type="submit" value="Submit Order" disabled title="Order is below $20 minimum."></p>
</form>
</body>
</html>

【问题讨论】：

if ($('#total').val() >= 20 ?>) 应该是if ($('#total').val() >= 20)
看起来我在之前尝试使用的一些 php 中留下了一个结束标记，但这仍然不能解决问题。它仍然没有启用提交按钮。
我现在已经更正了示例中的 ?> 问题。

标签： javascript php html calculation

【解决方案1】：

$('#total') 查找 id 为 total 的元素，但你没有它（你只有名字），

所以，通过添加 id - 表单正在工作

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>temp</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script language="javascript">
function calculate(form)
{
var item1 = form.item1.value;
var item2 = form.item2.value;
form.total.value = (item1 * 10) + (item2 * 30);
};
</script>

<script language="javascript">
setInterval(function () {
    if ($('#total').val() >= 20)
        $(":submit").removeAttr("disabled");
    else
        $(":submit").attr("disabled", "disabled");
}, 1);
</script>

</head>
<body>
<form method="POST" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" >
<table>
<tr>
<td align="center"><strong>Quantity</strong></td>
<td align="center"><strong>price</strong></td>
<td align="center"><strong>total</strong></td>
</tr>
<tr>
<td>item1<input type="number" name="item1" size="20" onchange="calculate(this.form)" value="0"></td>
<td width="39">$10</td>

</tr>
<tr>
<td>item2<input type="number" name="item2" size="20" onchange="calculate(this.form)" value="0"> </td>
<td>$30</td>
</tr>
<tr>
<td> </td>
<td>total</td>
<td> <input type="number" id="total" name="total" size="20"></td>
</tr>
</table>
<p><input type="submit" value="Submit Order" disabled title="Order is below $20 minimum."></p>
</form>
</body>
</html>

【讨论】：

ID 是有道理的。谢谢！我似乎缺少的另一件事是 jquery 链接。我得到提交启用/禁用代码的小提琴在他们的示例中没有，即使它有效。