suchen

Heim  >  Fragen und Antworten  >  Hauptteil

Wie kann die eingegebene Zahl erhöht werden?

Bei Verwendung von HTML-input 元素时,我尝试实现 step-Attributen. Auf diese Weise kann ich 100 zum aktuellen Wert addieren, indem ich auf die Auf-/Ab-Pfeile im Eingabefeld klicke.

Allerdings bestimmt step gesetzliche Werte, sodass es nicht mit einfachen Schritten funktioniert. Wenn ich beispielsweise 123 eingebe, erhöht sich der Wert auf 200 und nicht auf 223.

// populate field
document.querySelector("input").value = "123";
<input type="number" step="100" value="0"/>

Gibt es eine einfache Lösung für input elementweise Inkrementierungs-/Dekrementierungsfunktionen?

P粉605233764P粉605233764266 Tage vor384

Antworte allen(2)Ich werde antworten

  • P粉459440991

    P粉4594409912024-04-02 17:25:23

    const input = document.getElementById("myInput");
    const incrementBtn = document.getElementById("incrementBtn");
    const decrementBtn = document.getElementById("decrementBtn");
    
    incrementBtn.addEventListener("click", () => {
      input.stepUp(100); // Increment the input value by 1
    });
    
    decrementBtn.addEventListener("click", () => {
      input.stepDown(100); // Decrement the input value by 1
    });
    <input id="myInput" type="number" value="123" min="0" step="1" />
    <button id="incrementBtn">Increment</button>
    <button id="decrementBtn">Decrement</button>

    在回调函数中,我们使用内置方法stepUp()和stepDown()分别将输入值递增和递减100。这些方法可确保正确修改输入值,无论步骤属性如何。

    Antwort
    0
  • P粉138871485

    P粉1388714852024-04-02 09:04:37

    step 推离属性:

    const input = document.querySelector('input');
    input.value = 123;
    input.setAttribute('value', 123);
    <input type="number" step="100">

    Antwort
    0
  • StornierenAntwort