<input type=text />සංඛ්‍යාත්මක යතුරු එබීම් (ප්ලස් '.') සඳහා පමණක් ඉඩ දීම සඳහා HTML පෙළ ආදානය ( ) සැකසීමට ඉක්මන් ක්‍රමයක් තිබේද?

^{සටහන: මෙය යාවත්කාලීන කළ පිළිතුරකි. පහත දැක්වෙන අදහස් යතුරු කේත සමඟ අවුල් වූ පැරණි අනුවාදයක් වෙත යොමු වේ.}

ජාවාස්ක්‍රිප්ට්

JSFiddle හි එය ඔබම උත්සාහ කරන්න .

ඔබට <input>පහත දැක්වෙන setInputFilterශ්‍රිතය සමඟ පෙළක ආදාන අගයන් පෙරහන් කළ හැකිය (පිටපත් + පේස්ට්, ඩ්‍රැග් + ඩ්‍රොප්, යතුරුපුවරු කෙටිමං, සන්දර්භය මෙනු මෙහෙයුම්, ටයිප් කළ නොහැකි යතුරු, භාරකාර ස්ථානය, විවිධ යතුරුපුවරු පිරිසැලසුම් සහ IE 9 සිට සියලුම බ්‍රව්සර් සඳහා සහය දක්වයි ) :

// 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.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);
      } else {
        this.value = "";
      }
    });
  });
}

setInputFilterආදාන පෙරණයක් ස්ථාපනය කිරීම සඳහා ඔබට දැන් ශ්‍රිතය භාවිතා කළ හැකිය :

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

වැඩි ආදාන පෙරහන් උදාහරණ සඳහා JSFiddle නිරූපණය බලන්න . ඔබ තවමත් සේවාදායක පාර්ශව වලංගු කිරීම කළ යුතු බව සලකන්න !

යතුරු ලියනය

මෙන්න මෙහි TypeScript අනුවාදය.

function setInputFilter(textbox: Element, inputFilter: (value: string) => boolean): void {
    ["input", "keydown", "keyup", "mousedown", "mouseup", "select", "contextmenu", "drop"].forEach(function(event) {
        textbox.addEventListener(event, function(this: (HTMLInputElement | HTMLTextAreaElement) & {oldValue: string; oldSelectionStart: number | null, oldSelectionEnd: number | null}) {
            if (inputFilter(this.value)) {
                this.oldValue = this.value;
                this.oldSelectionStart = this.selectionStart;
                this.oldSelectionEnd = this.selectionEnd;
            } else if (Object.prototype.hasOwnProperty.call(this, 'oldValue')) {
                this.value = this.oldValue;
                if (this.oldSelectionStart !== null &&
                    this.oldSelectionEnd !== null) {
                    this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
                }
            } else {
                this.value = "";
            }
        });
    });
}

jQuery

මෙහි jQuery අනුවාදයක් ද ඇත. මෙම පිළිතුර බලන්න .

HTML 5

HTML 5 සමඟ ස්වදේශීය විසඳුමක් ඇත <input type="number">( පිරිවිතර බලන්න ), නමුත් බ්‍රව්සර් සහාය වෙනස් වන බව සලකන්න:

• බොහෝ බ්‍රව්සර් වලංගු වන්නේ ආකෘති පත්‍රය ඉදිරිපත් කිරීමේදී මිස ටයිප් කිරීමේදී නොවේ.
• බොහෝ ජංගම බ්‍රව්සර්step , minසහ maxගුණාංග සඳහා සහය නොදක්වයි .
• ක්‍රෝම් (අනුවාදය 71.0.3578.98) තවමත් පරිශීලකයාට අක්ෂර ඇතුළු කිරීමට eසහ Eක්ෂේත්‍රයට ඇතුළු වීමට ඉඩ දෙයි . මෙම ප්‍රශ්නය ද බලන්න .
• ෆයර්ෆොක්ස් (64.0 අනුවාදය) සහ එජ් (එඩ්ජ්එච්ටීඑම්එල් 17.17134) තවමත් පරිශීලකයාට ඕනෑම පෙළක් ක්ෂේත්‍රයට ඇතුළු කිරීමට ඉඩ දෙයි .

එය ඔබම උත්සාහ w3schools.com මත .

මෙම DOM භාවිතා කරන්න

<input type='text' onkeypress='validate(event)' />

මේ පිටපත

function validate(evt) {
  var theEvent = evt || window.event;

  // Handle paste
  if (theEvent.type === 'paste') {
      key = event.clipboardData.getData('text/plain');
  } else {
  // Handle key press
      var key = theEvent.keyCode || theEvent.which;
      key = String.fromCharCode(key);
  }
  var regex = /[0-9]|\./;
  if( !regex.test(key) ) {
    theEvent.returnValue = false;
    if(theEvent.preventDefault) theEvent.preventDefault();
  }
}

මේ සඳහා හොඳ පිළිතුරක් ලබා ගැනීම සඳහා මම දිගු හා වෙහෙස මහන්සි වී සොයා බැලුවෙමි, අපට එය අතිශයින්ම අවශ්‍යය <input type="number", නමුත් එයින් කෙටියෙන් කිවහොත්, මේ 2 මට ඉදිරිපත් කළ හැකි වඩාත්ම සංක්ෂිප්ත ක්‍රම වේ:

<input type="text" 
       onkeyup="this.value=this.value.replace(/[^\d]/,'')">

මකාදැමීමට පෙර තත්පරයකට බෙදීම පිළි නොගත් චරිතයට ඔබ අකමැති නම්, පහත ක්‍රමය මගේ විසඳුමයි. අමතර කොන්දේසි රාශියක් සැලකිල්ලට ගන්න, මෙය සියලු ආකාරයේ සංචාලන සහ හොට්කී අක්‍රීය කිරීමෙන් වළක්වා ගැනීමයි. මෙය සංයුක්ත කරන්නේ කෙසේදැයි යමෙක් දන්නේ නම්, අපට දන්වන්න!

<input type="text" 
onkeydown="return ( event.ctrlKey || event.altKey 
                    || (47<event.keyCode && event.keyCode<58 && event.shiftKey==false) 
                    || (95<event.keyCode && event.keyCode<106)
                    || (event.keyCode==8) || (event.keyCode==9) 
                    || (event.keyCode>34 && event.keyCode<40) 
                    || (event.keyCode==46) )">

මෙන්න හරියටම දශමයකට ඉඩ දෙන සරල එකක්, නමුත් තවත් නැත:

<input type="text" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" />

මට තවත් හොඳ උදාහරණයක්:

function validateNumber(event) {
    var key = window.event ? event.keyCode : event.which;
    if (event.keyCode === 8 || event.keyCode === 46) {
        return true;
    } else if ( key < 48 || key > 57 ) {
        return false;
    } else {
        return true;
    }
};

යතුරුපුවරු සිදුවීමට අමුණන්න

$(document).ready(function(){
    $('[id^=edit]').keypress(validateNumber);
});

සහ HTML:

<input type="input" id="edit1" value="0" size="5" maxlength="5" />

මෙන්න jsFiddle උදාහරණයක්

මෙහි බොහෝ පිළිතුරු සියල්ලටම යතුරු සිදුවීම් භාවිතා කිරීමේ දුර්වලතාවයක් ඇත .

යතුරුපුවරු මැක්‍රෝස්, පිටපත් + පේස්ට් සහ අනවශ්‍ය හැසිරීම් සමඟ පෙළ තෝරා ගැනීමේ හැකියාව බොහෝ පිළිතුරු මගින් සීමා කරනු ඇත, අනෙක් ඒවා විශේෂිත jQuery ප්ලගීන මත රඳා පවතින බව පෙනේ.

ආදාන යාන්ත්‍රණය (යතුරු ආ roke ාතය, පිටපත් + පේස්ට්, රයිට් ක්ලික් පිටපත + පේස්ට්, කථන සිට පෙළ දක්වා) නොසලකා මෙම සරල විසඳුම මට හරස් වේදිකාවක් සඳහා වඩාත් සුදුසු බව පෙනේ. සියලුම පෙළ තේරීමේ යතුරුපුවරු මැක්‍රෝස් තවමත් ක්‍රියාත්මක වන අතර, එය ස්ක්‍රිප්ට් මගින් සංඛ්‍යාත්මක නොවන අගයක් සැකසීමේ හැකියාව පවා සීමා කරයි.

function forceNumeric(){
    var $input = $(this);
    $input.val($input.val().replace(/[^\d]+/g,''));
}
$('body').on('propertychange input', 'input[type="number"]', forceNumeric);

HTML5 සතුව ඇත <input type=number>, එය ඔබට ගැලපේ. දැනට, ඔපෙරා පමණක් ස්වදේශීයව එයට සහාය දක්වයි, නමුත් ජාවාස්ක්‍රිප්ට් ක්‍රියාත්මක කිරීමේ ව්‍යාපෘතියක් තිබේ.

මෙහි සඳහන් පිළිතුරු දෙකේ එකතුවක් භාවිතා කිරීමට මම තීරණය කළෙමි

<input type="number" />

සහ

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode
    return !(charCode > 31 && (charCode < 48 || charCode > 57));
}

<input type="text" onkeypress="return isNumberKey(event);">

HTML5 රීජෙක්ස් සඳහා සහය දක්වයි, එබැවින් ඔබට මෙය භාවිතා කළ හැකිය:

<input id="numbersOnly" pattern="[0-9.]+" type="text">

අවවාදයයි: සමහර බ්‍රව්සර් තවමත් මෙයට සහය නොදක්වයි.

ජාවාස්ක්‍රිප්ට්

function validateNumber(evt) {
    var e = evt || window.event;
    var key = e.keyCode || e.which;

    if (!e.shiftKey && !e.altKey && !e.ctrlKey &&
    // numbers   
    key >= 48 && key <= 57 ||
    // Numeric keypad
    key >= 96 && key <= 105 ||
    // Backspace and Tab and Enter
    key == 8 || key == 9 || key == 13 ||
    // Home and End
    key == 35 || key == 36 ||
    // left and right arrows
    key == 37 || key == 39 ||
    // Del and Ins
    key == 46 || key == 45) {
        // input is VALID
    }
    else {
        // input is INVALID
        e.returnValue = false;
        if (e.preventDefault) e.preventDefault();
    }
}

අමතර ඔබට කොමාව, කාල සීමාව සහ us ණ එකතු කළ හැකිය (, .-)

  // comma, period and minus, . on keypad
  key == 190 || key == 188 || key == 109 || key == 110 ||

HTML

<input type="text" onkeydown="validateNumber(event);"/ >

හරිම සරලයි ....

// ජාවාස්ක්‍රිප්ට් ශ්‍රිතයක (HTML හෝ PHP භාවිතා කළ හැකිය).

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

ඔබගේ පෝරම ආදානය තුළ:

<input type=text name=form_number size=20 maxlength=12 onkeypress='return isNumberKey(event)'>

ආදාන උපරිම සමඟ. (ඉහත කරුණු අංක 12 කින් යුත් අංකයකට ඉඩ දෙයි)

විසඳුම් 2:

පෝරම වලංගු කරන්නෙකු භාවිතා කරන්න (උදාහරණයක් ලෙස jQuery වලංගු කිරීමේ ප්ලගිනය සමඟ )

නිත්‍ය ප්‍රකාශනය සමඟ ආදාන ක්ෂේත්‍රයේ onblur (එනම් පරිශීලකයා ක්ෂේත්‍රයෙන් ඉවත් වන විට) සිදුවීම අතරතුර පරීක්ෂා කරන්න:

<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);"/>

ආරක්ෂිත ප්‍රවේශයක් වන්නේ යතුරු එබීම සහ යතුරු කේත පෙරීමට උත්සාහ කිරීම වෙනුවට ආදානයේ වටිනාකම පරීක්ෂා කිරීමයි.

මේ ආකාරයෙන් පරිශීලකයාට යතුරුපුවරු ඊතල, නවීකරණ යතුරු, බැක්ස්පේස්, මකාදැමීම, සම්මත නොවන යතුරුපුවරු භාවිතා කිරීම, ඇලවීම සඳහා මූසිකය භාවිතා කිරීම, පෙළ ඇදගෙන යාම සහ අතහැර දැමීමේ පෙළ භාවිතා කිරීම, ප්‍රවේශවීමේ යෙදවුම් භාවිතා කිරීම පවා නොමිලේ.

පහත ස්ක්‍රිප්ටය ධනාත්මක හා negative ණ සංඛ්‍යා වලට ඉඩ දෙයි

1
10
100.0
100.01
-1
-1.0
-10.00
1.0.0 //not allowed

var input = document.getElementById('number');
input.onkeyup = input.onchange = enforceFloat;

//enforce that only a float can be inputed
function enforceFloat() {
  var valid = /^\-?\d+\.\d*$|^\-?[\d]*$/;
  var number = /\-\d+\.\d*|\-[\d]*|[\d]+\.[\d]*|[\d]+/;
  if (!valid.test(this.value)) {
    var n = this.value.match(number);
    this.value = n ? n[0] : '';
  }
}

<input id="number" value="-3.1415" placeholder="Type a number" autofocus>

සංස්කරණය කරන්න: මම මගේ පැරණි පිළිතුර ඉවත් කළේ එය දැන් පැරණි යැයි සිතන බැවිනි.

මේ සඳහා ඔබට රටාව භාවිතා කළ හැකිය:

<input id="numbers" pattern="[0-9.]+" type="number">

මෙහිදී ඔබට සම්පූර්ණ ජංගම වෙබ් අඩවි අතුරුමුහුණත් දැක ගත හැකිය .

කරුණාකර පහත සඳහන් විසඳුම සොයා ගන්න. මෙම පරිශීලක පමණක් ඇතුළු කිරීමට හැකි විය හැකි numericද පරිශීලක කිරීමට හැකි විය නොහැකි, වටිනාකම copy, paste, dragහා dropආදාන දී.

අවසර ලත් චරිත

0,1,2,3,4,5,6,7,8,9

සිදුවීම් හරහා චරිත සහ චරිත සඳහා අවසර නැත

• අකාරාදී අගය
• විශේෂ චරිත
• පිටපත් කරන්න
• අලවන්න
• අදින්න
• අතහරින්න

$(document).ready(function() {
  $('#number').bind("cut copy paste drag drop", function(e) {
      e.preventDefault();
  });     
});
function isNumberKey(evt) {
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" class="form-control" name="number" id="number" onkeypress="return isNumberKey(event)" placeholder="Enter Numeric value only">

එය ක්‍රියාත්මක නොවන්නේ නම් මට දන්වන්න.

ආදාන ක්ෂේත්‍රය තුළ ඔබට සංඛ්‍යා පමණක් එකතු කළ හැකි තවත් එක් උදාහරණයක් , අකුරු කළ නොහැක

<input type="text" class="form-control" id="phone" name="phone" placeholder="PHONE" spellcheck="false" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');">

ඔබට ඇල්ෆා හෝ සංඛ්‍යා අතර උපාංගයට (සමහර විට ජංගම දුරකථනයක්) යෝජනා කිරීමට අවශ්‍ය නම් ඔබට භාවිතා කළ හැකිය <input type="number">.

Event.keyCode හෝ event.which: වෙනුවට jQuery භාවිතා කර කෙටි (මිහිරි) ක්‍රියාත්මක කරන්න.

$('input.numeric').live('keyup', function(e) {
  $(this).val($(this).val().replace(/[^0-9]/g, ''));
});

ටයිප් කළ අකුර මොහොතකින් දිස්වන කුඩා අතුරු ආබාධයක් පමණක් වන අතර CTRL / CMD + A ටිකක් අමුතු ලෙස හැසිරේ.

input type="number" යනු HTML5 ගුණාංගයකි.

අනෙක් අවස්ථාවේදී මෙය ඔබට උපකාරී වනු ඇත:

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

<input type="number" name="somecode" onkeypress="return isNumberKey(event)"/>

ජාවාස්ක්‍රිප්ට් කේතය:

function validate(evt)
{
    if(evt.keyCode!=8)
    {
        var theEvent = evt || window.event;
        var key = theEvent.keyCode || theEvent.which;
        key = String.fromCharCode(key);
        var regex = /[0-9]|\./;
        if (!regex.test(key))
        {
            theEvent.returnValue = false;

            if (theEvent.preventDefault)
                theEvent.preventDefault();
            }
        }
    }

HTML කේතය:

<input type='text' name='price' value='0' onkeypress='validate(event)'/>

බැක්ස්පේස් යතුරු කේතය 8 ක් වන අතර රීජෙක්ස් ප්‍රකාශනයක් එයට ඉඩ නොදෙන නිසා එය හොඳින් ක්‍රියා කරයි, එබැවින් එය දෝෂය මඟ හැරීමට පහසු ක්‍රමයකි :)

type = "number" භාවිතා කරන්න දැන් මෙම ගුණාංගය බොහෝ බ්‍රව්සර් වල සහය දක්වයි

<input type="number" maxlength="3" ng-bind="first">

මෙම ගැටළුව විසඳීම සඳහා පහසු ක්‍රමයක් නම්, පෙළ කොටුව තුළ ටයිප් කර ඇති අක්ෂර රීජෙක්ස් සමඟ වලංගු කිරීම සඳහා jQuery ශ්‍රිතයක් ක්‍රියාත්මක කිරීමයි:

ඔබේ html කේතය:

<input class="integerInput" type="text">

Js ක්‍රියා කරන්නේ jQuery භාවිතා කරමිනි

$(function() {
    $('.integerInput').on('input', function() {
      this.value = this.value
        .replace(/[^\d]/g, '');// numbers and decimals only

    });
});

$(function() {
        $('.integerInput').on('input', function() {
          this.value = this.value
            .replace(/[^\d]/g, '');// numbers and decimals only
            
        });
    });

<script
			  src="https://code.jquery.com/jquery-2.2.4.min.js"
			  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
			  crossorigin="anonymous">
</script>

<input type="text" class="integerInput"/>


		

JQuery භාවිතයෙන් වෙනත් ප්‍රභේදයක් පමණි

$(".numeric").keypress(function() {
    return (/\d/.test(String.fromCharCode(event.which) ))
});

ඔබට ආදාන අගය (පෙරනිමියෙන් නූල් ලෙස සලකනු ලැබේ) සංඛ්‍යාත්මකව බලෙන් සමාන කළ හැකිය, වැනි:

if(event.target.value == event.target.value * 1) {
    // returns true if input value is numeric string
}

කෙසේ වෙතත්, ඔබ එය යතුරු වැනි සිදුවීම් සමඟ බැඳිය යුතුය.

<input name="amount" type="text" value="Only number in here"/> 

<script>
    $('input[name=amount]').keyup(function(){
        $(this).val($(this).val().replace(/[^\d]/,''));
    });
</script>

මම ඉතා හොඳ පිළිතුරු කිහිපයක් දුටුවෙමි, කෙසේ වෙතත් මම ඒවාට හැකි තරම් කුඩා හා සරල ලෙස කැමතියි, එබැවින් සමහර විට එයින් කෙනෙකුට ප්‍රයෝජන ලැබෙනු ඇත. මම මේ වගේ ජාවාස්ක්‍රිප්ට් Number()සහ isNaNක්‍රියාකාරිත්වය භාවිතා කරමි :

if(isNaN(Number(str))) {
   // ... Exception it is NOT a number
} else {
   // ... Do something you have a number
}

මෙය උපකාරී වේ යැයි සිතමි.

මෙම DOM භාවිතා කරන්න:

<input type = "text" onkeydown = "validate(event)"/>

මෙම පිටපත:

validate = function(evt)
{
    if ([8, 46, 37, 39, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 35, 36].indexOf(evt.keyCode || evt.which) == -1)
    {
        evt.returnValue = false;
        if(evt.preventDefault){evt.preventDefault();}
    }
}

... හෝ මෙම ස්ක්‍රිප්ට්, දර්ශක ඕෆ් නොමැතිව, දෙකක් භාවිතා කරමින් for...

validate = function(evt)
{
    var CharValidate = new Array("08", "046", "039", "948", "235");
    var number_pressed = false;
    for (i = 0; i < 5; i++)
    {
        for (Ncount = 0; Ncount < parseInt(CharValidate[i].substring(0, 1)) + 1; Ncount++)
        {
            if ((evt.keyCode || evt.which) == parseInt(CharValidate[i].substring(1, CharValidate[i].lenght)) + Ncount)
            {
                number_pressed = true;
            }
        }
    }
    if (number_pressed == false)
    {
        evt.returnValue = false;
        if(evt.preventDefault){evt.preventDefault();}
    }
}

මම onkeypress වෙනුවට onkeydown ගුණාංගය භාවිතා කළෙමි, මන්ද onkeydown ගුණාංගය onkeypress ගුණාංගයට පෙර පරීක්ෂා කර ඇති බැවිනි. ගැටලුව පවතින්නේ ගූගල් ක්‍රෝම් බ්‍රව්සරයේ ය.

"ඔන්කිප්‍රෙස්" ගුණාංගය සමඟ, ගූගල් ක්‍රෝම් හි "වැළැක්වීමේ ඩීෆෝල්ට්" සමඟ TAB පාලනය කළ නොහැකි වනු ඇත, කෙසේ වෙතත්, "ඔන්කිඩවුන්" යන ගුණාංගය සමඟ, ටාබ් පාලනය කළ හැකිය!

TAB => 9 සඳහා ASCII කේතය

පළමු ස්ක්‍රිප්ටයට දෙවැන්නාට වඩා අඩු කේතයක් ඇත, කෙසේ වෙතත්, ASCII අක්ෂරවල සියලු යතුරු තිබිය යුතුය.

දෙවන ස්ක්‍රිප්ට් එක පළමු එකට වඩා විශාල ය, නමුත් අරාව සඳහා සියලු යතුරු අවශ්‍ය නොවේ. අරාවෙහි එක් එක් ස්ථානයෙහි පළමු ඉලක්කම් වන්නේ එක් එක් ස්ථානය කියවන වාර ගණනයි. සෑම කියවීමක් සඳහාම, ඊළඟට 1 දක්වා වැඩි කෙරේ. උදාහරණයක් ලෙස:




NCount = 0

48 + NCount = 48

NCount + +

48 + NCount = 49

NCount + +

...

48 + NCount = 57




සංඛ්‍යාත්මක යතුරු සම්බන්ධයෙන් 10 (0 - 9) ක් පමණි, නමුත් ඒවා මිලියනයක් නම් මෙම සියලු යතුරු සමඟ අරාවක් සෑදීම අර්ථවත් නොවේ.

ASCII කේත:

• 8 ==> (බැක්ස්පේස්);
• 46 => (මකන්න);
• 37 => (වම් ඊතලය);
• 39 => (දකුණු ඊතලය);
• 48 - 57 => (අංක);
• 36 => (නිවස);
• 35 => (අවසානය);

මෙය වැඩිදියුණු කළ ශ්‍රිතයකි:

function validateNumber(evt) {
  var theEvent = evt || window.event;
  var key = theEvent.keyCode || theEvent.which;
  if ((key < 48 || key > 57) && !(key == 8 || key == 9 || key == 13 || key == 37 || key == 39 || key == 46) ){
    theEvent.returnValue = false;
    if (theEvent.preventDefault) theEvent.preventDefault();
  }
}

හොඳම ක්‍රමය (සියලු වර්ගවල සංඛ්‍යා වලට ඉඩ දෙන්න - සැබෑ negative ණ, සැබෑ ධනාත්මක, ඉන්ටෙගර් negative ණ, පූර්ණ සංඛ්‍යා ධනාත්මක):

$(input).keypress(function (evt){
    var theEvent = evt || window.event;
    var key = theEvent.keyCode || theEvent.which;
    key = String.fromCharCode( key );
    var regex = /[-\d\.]/; // dowolna liczba (+- ,.) :)
    var objRegex = /^-?\d*[\.]?\d*$/;
    var val = $(evt.target).val();
    if(!regex.test(key) || !objRegex.test(val+key) || 
            !theEvent.keyCode == 46 || !theEvent.keyCode == 8) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();
    };
}); 

Geowa4 හි විසඳුමේ දීර් version අනුවාදය මෙයයි . සහාය minසහ maxගුණාංග. අංකය පරාසයෙන් බැහැර නම්, පෙර අගය පෙන්වනු ඇත.

ඔබට එය මෙහි පරීක්ෂා කළ හැකිය.

භාවිතය: <input type=text class='number' maxlength=3 min=1 max=500>

function number(e) {
var theEvent = e || window.event;
var key = theEvent.keyCode || theEvent.which;
if(key!=13&&key!=9){//allow enter and tab
  key = String.fromCharCode( key );
  var regex = /[0-9]|\./;
  if( !regex.test(key)) {
    theEvent.returnValue = false;
    if(theEvent.preventDefault) theEvent.preventDefault();
    }   
  }
}

$(document).ready(function(){
    $("input[type=text]").filter(".number,.NUMBER").on({
        "focus":function(e){
         $(e.target).data('oldValue',$(e.target).val());
            },
        "keypress":function(e){
                e.target.oldvalue = e.target.value;
                number(e);
            },
        "change":function(e){
            var t = e.target;
            var min = $(t).attr("min");
            var max = $(t).attr("max");
            var val = parseInt($(t).val(),10);          
            if( val<min || max<val)
                {
                    alert("Error!");
                    $(t).val($(t).data('oldValue'));
                }

            }       
    });     
});

යෙදවුම් ගතික නම් මෙය භාවිතා කරන්න:

$(document).ready(function(){
    $("body").on("focus","input[type=text].number,.NUMBER",function(e){
        $(e.target).data('oldValue',$(e.target).val());
    }); 
    $("body").on("keypress","input[type=text].number,.NUMBER",function(e){
        e.target.oldvalue = e.target.value;
        number(e);
    }); 
    $("body").on("change","input[type=text].number,.NUMBER",function(e){
        var t = e.target
        var min = $(t).attr("min");
        var max = $(t).attr("max");
        var val = parseInt($(t).val());         
        if( val<min || max<val)
            {
                alert("Error!");
                $(t).val($(t).data('oldValue'));
            }
    }); 
});