如何在JavaScript中设置从数据库输入的最大数量? [英] How do I set maximum number input from database in javascript?

问题描述

我希望根据数据库中的数量在输入类型=数量"中设置最大输入数量.目前，在尝试从数据库中获取最大值之前，我正在尝试使其在data-max的基础上工作，但是它似乎无法正常工作.

I wish to set a maximum number input in an "input type=number" based on the amount in the database. Currently, I am trying for it to work base on data-max before i try getting my max value from my database, however it cant seem to work.

在此之前，曾有人问过它，但是我仍然听不懂:在php/javascript中设置数据库的最大输入文本数

It has been asked before previously here, however I cant understand it still: Set maximum number input text from database in php/javascript

HTML:

 <div class="ui-block-a">
                                    <div id="test">
                                        <input type="button" value="-" class="minus" id="jumlah" name="jumlah">
                                    </div>
                                </div>

                                <div class="ui-block-b">

                                    <input type="number" min="1" max="10" id="quantity" value="0" name="quantity" title="Qty" class="input-text qty text" size="6" pattern="" inputmode="" data-max="3" onkeyup="check(this);" readonly>

                                </div>

                                <div class="ui-block-c">
                                    <div id="test2">
                                        <input type="button" value="+" class="plus" id="jumlah2" name="jumlah2">
                                    </div>
                                </div>

JS:

function check(quantity) {
    div.addEventListener('click', function () { });
    var max = quantity.getAttribute("data-max");
    if (parseInt(quantity.value) > parseInt(max)) {
        alert("Amount out of max!");
    }
}

推荐答案

基于您提供的信息，您很难准确地理解您要完成的任务以及问题所在(例如，提到数据库)依赖项和php，在您的代码中都没有引用.)，但是通过查看代码，我会把您的问题解释为...

Based off of the information you've provided its difficult to understand exactly what you're trying to accomplish and what the issue is (ie. you mention a database dependency and php, neither of which are referenced in your code.), but from looking at the code I would decipher your problem as...

<代码>在通过+/-按钮增加或减少字段值后，当输入字段达到最大值(由data-max属性指定)时，尝试提供'Alert'."

假设这是您要完成的工作...

Assuming this what you you are trying to accomplish then...

1. 您需要将事件处理程序(decrement())移至输入按钮，而不是输入文本字段，因为按钮是接收用户事件的按钮.由于按钮不接收按键事件，因此thius也需要处于onclick状态.您在文本输入中具有只读"属性，因此我假设无法通过文本/键盘对其进行编辑?

<input type="button" value="-" onclick="decrement()" class="minus" id="jumlah" name="jumlah">

1. 除非您要在其他地方处理这些事件，否则您实际上需要使用增量/减量输入按钮来做一些事情.

function increment () {
  let quantity = document.getElementById('quantity'),
            newVal =  Number(quantity.value) + 1;
  if (!isOverMax()) {
    quantity.value = newVal;
  }
}
function decrement () {
    let quantity = document.getElementById('quantity');
    quantity.value = Number(quantity.value) - 1;
}

1. 您应该在每个增量函数之后调用check()函数(重命名为isOverMax()以便更声明性和语义正确).！isOverMax()

如果那是您的目标，则应添加一个条件以实际上防止输入字段增加到最大值以上.一种方法是从isOverMax()函数返回一个布尔值.

You should add a conditional to actually prevent the input field from being incremented above the max if thats your goal. One way to do this is by returning a boolean from the isOverMax() function.

function isOverMax() {
  let max = quantity.getAttribute("data-max");

  if (parseInt(quantity.value) >= parseInt(max)) {
    alert("Amount out of max!");
    return true;
  }
  return false;
}

此代码绝对可以组织得更好，但是应该使您更接近要完成的工作.

This code could definitely be organized better, but should get you closer to what you're trying to accomplish.

完整的示例...

https://jsfiddle.net/aguy2mwx/

希望这会有所帮助！

这篇关于如何在JavaScript中设置从数据库输入的最大数量?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！