HTML tekstisisestus võimaldab ainult numbrilist sisestust

Kas on olemas kiire viis HTML tekstisisendi (<input type=text />) seadistamiseks nii, et see lubaks ainult numbrilisi klahvivajutusi (pluss '.')? Pärast minimaalset, numbrilist väärtust ei lubanud alguses nagu 0.0 lubatud, kuid .0* ei lubata

Shakil Hossain
Redigeeritud küsimus T00 november 2019 в 9:29
Programmeerimine
javascript html jquery
T33 jaanuar 2009 в 2:36
21 vaated
Lahendus

Märkus: See on ajakohastatud vastus. Allpool olevad kommentaarid viitavad vanale versioonile, mis segas võtmekoodidega.

JavaScript

Proovige seda ise [JSFiddle'is][1].

Saate filtreerida teksti <input> sisendväärtusi järgmise funktsiooniga setInputFilter (toetab Copy+Paste, Drag+Drop, klaviatuurikombinatsioone, kontekstmenüü operatsioone, mitte-kirjutatavaid klahve, caret positsiooni, erinevaid klaviatuuri paigutusi ja [kõiki brausereid alates IE 9-st][2]):

// Restricts input for the given textbox to the given inputFilter function.
function setInputFilter(textbox, inputFilter) {
  ["input", "keydown", "keyup", "mousedown", "mouseup", "select", "contextmenu", "drop"].forEach(function(event) {
    textbox.oldValue = "";
    textbox.addEventListener(event, function() {
      if (inputFilter(this.value)) {
        this.oldValue = this.value;
        this.oldSelectionStart = this.selectionStart;
        this.oldSelectionEnd = this.selectionEnd;
      } else if (this.hasOwnProperty("oldValue")) {
        this.value = this.oldValue;
        this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
      }
    });
  });
}

Sisendfiltri paigaldamiseks saab nüüd kasutada funktsiooni setInputFilter:

setInputFilter(document.getElementById("myTextBox"), function(value) {
  return /^\d*\.?\d*$/.test(value); // Allow digits and '.' only, using a RegExp
}

Siin on veel mõned näited sisendfiltrite kohta, mis võivad olla kasulikud:


return /^-?\d*$/.test(value);                // Integer
return /^\d*$/.test(value);                  // Integer >= 0
return /^\d*$/.test(value) &&                // Integer >= 0 and
emkey08
Redigeeritud vastus T00 november 2019 в 10:02
Kommentaarid (29)

2 lahendust:

(näiteks jQuery validation plugin).

Teha kontroll sisendvälja onblur (st kui kasutaja lahkub väljalt) sündmuse ajal, kasutades regulaaravaldist:

<script type="text/javascript">
function testField(field) {
    var regExpr = new RegExp("^\d*\.?\d*$");
    if (!regExpr.test(field.value)) {
      // Case of error
      field.value = "";
    }
}

</script>

<input type="text" ... onblur="testField(this);"/>
Ian Jacobs
Redigeeritud vastus T33 detsember 2010 в 3:15
Kommentaarid (5)

Võite proovida kasutada '''onkeydown''' sündmust ja tühistada sündmus (event.preventDefault või midagi sellist), kui see'ei ole üks lubatud võtmetest.

Kommentaarid (0)