设置来自数据库 JavaScript 的 HTML 输入编号的最大值

Question

我需要将输入数字的最大值设置为数据库中剩余的数量。是否有可能或有一些方法可以做到这一点？我需要首先验证输入值是否等于或小于剩余的股票，如果大于它将提示输入必须小于或等于最大值的消息。

数据库示例：

id_item | item          | brands    | max
- - - - - - - - - - - - - - - - - - - - - - -
1       | Shampoo       |creamsilk  |2
2       | conditioner   |creamsilk  |5
3       | soap          |safeguard  |7

Answer 1

在客户端，您可以使用 onChange 事件
验证输入值 示例：

document.getElementById('input')
.addEventListener('change', (event) => {
if (event.target.value > 3) {
alert('there is only 3 shampoo left');
}
});

<input type="number" id="input" />

Answer 2

检查int浏览器使用JS.当输入的(对于eaxmple)值发生变化时，一个事件是琐碎的，并且在事件处理程序中，一些代码用于检查值。似乎 mvvm 模式适合这种情况。

Answer 3

如果你想使用javascript， 您可以使用

数学最小值(值，最大值);

此函数从参数中获取最小值。

这将是答案。

Answer 4

HTML 5 现在提供了一种指定表单中数字字段值限制的方法。 例如，您可以将其放在HTML页面中。

<input id="qty" type="number" min="0" max="42"> </p>Order now, only 42 left!</p?

然后，用户将无法输入过高的数字。当然，当用户提交表单时，您必须在后端再次验证此数字(用户可以轻松地更改网页上的html;此外，较旧的浏览器会忽略min和max属性)。

Answer 5

你需要提供你正在使用的数据库框架和你正在使用的后端，因为它不仅仅是javascript本身。假设这是MySql和PHP;

您可以轻松地对最大值进行硬编码，尽管从不建议这样做。在您的 for 循环中，当循环浏览产品时：

<input
type="number"
data-max="<?php echo $rows[$i]["max"];?>"
min="0"
max="<?php echo $rows[$i]["max"];?>"
class="hasMaxInput">

若要进一步使用警报，请执行以下操作：

<script>
$(".hasMaxInput").on("change", function(e) {
var max=$(this).attr("data-max");
var inp=$(this).val();
if (inp >= max) {
alert("Exceeded amount value!");
$(this).val(max);
} else {
// cont.
}
});
</script>