it-swarm.com.ru

Мельхор Мэнэйра де рестрингир ум кампо де тексто апенас нумерос?

Это означает, что вы можете использовать Javascript для пересылки, а не для того, чтобы узнать, где вы находитесь. Apenas entrada numérica e nenhuma outra letra ou caractere. О проблемах, связанных с REALMENTE rejeita todas as outras entradas-chave, comoctrl-APara Selecionar o texto, ou até mesmo qualquer outra função do navegador comoctrl-TОУctrl-Wenquanto a caixa de texto está selecionada. Сценарий может быть написан на английском языке. Obrigado Aqui está o código que estou usando agora:

function numbersonly(e, decimal) 
{
    var key;
    var keychar;

    if (window.event) 
        key = window.event.keyCode;
    else if (e) 
        key = e.which;
    else 
        return true;

    keychar = String.fromCharCode(key);

    if ((key==null) || (key==0) || (key==8) ||  (key==9) || (key==13) || (key==27))
       return true;     
    else if ((("0123456789").indexOf(keychar) > -1))
       return true;
    else if (decimal && (keychar == "."))
       return true;        
    else
       return false;
}

Правка: Nenhuma das soluções fornecidas resolu o meu problemma de allowir comandos comoctrl-Aenquanto a caixa de texto está selecionada. Esse foi o ponto de minha pergunta aqui, então voltei usar o meu roteiro original. Ах, Бем.

39
RobHardgood

Это то, что я сделал в другой раз только для чисел, это позволит использовать и все средства форматирования.

jQuery

$('input').keypress(function(e) {
    var a = [];
    var k = e.which;

    for (i = 48; i < 58; i++)
        a.Push(i);

    if (!(a.indexOf(k)>=0))
        e.preventDefault();
});​

Попытайся

http://jsfiddle.net/zpg8k/

Как примечание, вы захотите фильтровать и на стороне отправки/на сервере, для вставки/контекстного меню и браузеров, которые не поддерживают событие вставки.

Изменить, чтобы уточнить несколько методов

Я вижу, вы подпрыгиваете вокруг принятого ответа, поэтому я кое-что проясню. Вы действительно можете использовать любой из перечисленных здесь методов, все они работают. Что я лично сделаю, так это использую мою для живой фильтрации на стороне клиента, а затем на стороне отправки и на стороне сервера использую RegEx, как это предлагают другие. Однако никакая клиентская сторона сама по себе не будет на 100% эффективна, поскольку ничто не мешает мне поместить document.getElementById('theInput').value = 'Hey, letters.'; в консоль и обойти любую проверку на стороне клиента (за исключением опроса, но я мог бы просто отменить setInterval из консоль так же). Используйте любое решение на стороне клиента, которое вам нравится, но убедитесь, что вы внедрили что-то на стороне отправки и на стороне сервера.

Редактировать 2 - @Tim Down

Хорошо, согласно комментариям, я должен был настроить две вещи, о которых я не думал. Во-первых, нажатие клавиши вместо keydown, которое было обновлено, но отсутствие indexOf в IE (серьезно Microsoft !?) также нарушает приведенный выше пример. Вот альтернатива 

$('input').keypress(function(e) {
    var a = [];
    var k = e.which;

    for (i = 48; i < 58; i++)
        a.Push(i);

    if (!($.inArray(k,a)>=0))
        e.preventDefault();
});​

Новый jsfiddle: http://jsfiddle.net/umNuB/

35
Robert
     .keypress(function(e)
               {
                 var key_codes = [48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 0, 8];

                 if (!($.inArray(e.which, key_codes) >= 0)) {
                   e.preventDefault();
                 }
               });

Вам тоже нужны клавиши Backspace и Delete;)

15
ialpert

Это работает в IE, Chrome и Firefox:

<input type="text" onkeypress="return event.charCode === 0 || /\d/.test(String.fromCharCode(event.charCode));" />
14
Hamund

http://jsfiddle.net/PgHFp/

<html>
<head>
<title>Test</title>
<script language="javascript">
function checkInput(ob) {
  var invalidChars = /[^0-9]/gi
  if(invalidChars.test(ob.value)) {
            ob.value = ob.value.replace(invalidChars,"");
      }
}
</script>
</head>

<body>
    <input type="text" onkeyup="checkInput(this)"/>
</body>
</html>
11
dogbane

Единственное событие, которое содержит информацию о набранном символе, это keypress. Что-либо связанное с символами, которое вы можете извлечь из свойства keyCode событий keydown или keyup, ненадежно и зависит от конкретной раскладки клавиатуры. Следующее будет предотвращать ввод нецифровой клавиатуры во всех основных браузерах, используя символ, полученный из события keypress. Это не помешает пользователю вставить или перетащить нечисловой текст в.

var input = document.getElementById("your_input");

input.onkeypress = function(evt) {
    evt = evt || window.event;
    if (!evt.ctrlKey && !evt.metaKey && !evt.altKey) {
        var charCode = (typeof evt.which == "undefined") ? evt.keyCode : evt.which;
        if (charCode && !/\d/.test(String.fromCharCode(charCode))) {
            return false;
        }
    }
};
4
Tim Down

Просто используйте регулярные выражения, чтобы избавиться от любых нечисловых символов, когда клавиша нажата или текстовое поле теряет фокус.

var numInput;
window.onload = function () {   
    numInput = document.getElementById('numonly');
    numInput.onkeydown = numInput.onblur = numInput.onkeyup = function()
    {
        numInput.value = numInput.value.replace(/[^0-9]+/,"");
    }
}
4
Randy the Dev

Может быть, вы используете загрузчик. Если так, этого может быть достаточно: 

<input type="text" data-mask="9999999"> 

Маска ввода

4
nicooga

Я использую это:

    oEl.keypress(function(ev)
    {
        var sKey = String.fromCharCode(ev.which);
        if (!sKey.match(/[0-9]/) || !sKey === "") 
            ev.preventDefault();            
    });

Преимущество состоит в том, что каждая клавиша, которая не обеспечивает ввод в поле, по-прежнему разрешена, поэтому вам не нужно беспокоиться о каждой отдельной специальной клавише. Даже такие комбинации, как CTRL + R, все еще работают.

EDIT Так как это не работает в Firefox, мне пришлось немного изменить функцию:

    oEl.keypress(function(ev)
    {
        var iKeyCode = ev.which || ev.keyCode;
        var aSpecialKeysForFirefox = [8, 9, 13, 27, 37, 38, 39, 40, 46];
        var sKey = String.fromCharCode(iKeyCode);
        if (sKey !== "" && $.inArray(iKeyCode, aSpecialKeysForFirefox ) < 0 && !sKey.match(/[0-9]/)) {
            ev.preventDefault();
        }
    });

Объяснение Все браузеры по-разному обрабатывают событие нажатия клавиши jquerys. Чтобы это работало в FF, добавлена ​​проверка $ .inArray. Поскольку firefoxs keypress-event не запускается, когда используются комбинации, такие как strg + tab, но другие делают, подход key.match по-прежнему добавляет небольшое значение последнему, так как он разрешает эти комбинации. 

4
hugo der hungrige

Следующий код - это то, что я широко использую. Я нашел сценарий на форуме, но изменил и расширил его в соответствии со своими потребностями:

<script type="text/javascript">
    // Restrict user input in a text field
    // create as many regular expressions here as you need:
    var digitsOnly = /[1234567890]/g;
    var integerOnly = /[0-9\.]/g;
    var alphaOnly = /[A-Za-z]/g;
    var usernameOnly = /[0-9A-Za-z\._-]/g;

    function restrictInput(myfield, e, restrictionType, checkdot){
        if (!e) var e = window.event
        if (e.keyCode) code = e.keyCode;
        else if (e.which) code = e.which;
        var character = String.fromCharCode(code);

        // if user pressed esc... remove focus from field...
        if (code==27) { this.blur(); return false; }

        // ignore if the user presses other keys
        // strange because code: 39 is the down key AND ' key...
        // and DEL also equals .
        if (!e.ctrlKey && code!=9 && code!=8 && code!=36 && code!=37 && code!=38 && (code!=39 || (code==39 && character=="'")) && code!=40) {
            if (character.match(restrictionType)) {
                if(checkdot == "checkdot"){
                    return !isNaN(myfield.value.toString() + character);
                } else {
                    return true;
                }
            } else {
                return false;
            }
        }
    }
</script>

Различные методы использования будут:

<!-- To accept only alphabets -->
<input type="text" onkeypress="return restrictInput(this, event, alphaOnly);">
<!-- To accept only numbers without dot -->
<input type="text" onkeypress="return restrictInput(this, event, digitsOnly);">
<!-- To accept only numbers and dot -->
<input type="text" onkeypress="return restrictInput(this, event, integerOnly);">
<!-- To accept only numbers and only one dot -->
<input type="text" onkeypress="return restrictInput(this, event, integerOnly, 'checkdot');">
<!-- To accept only characters for a username field -->
<input type="text" onkeypress="return restrictInput(this, event, usernameOnly);">
3
Nirmal

Добавьте <script type="text/javascript" src="jquery.numeric.js"></script>, затем используйте

 $("element").numeric({ decimal: false, negative: false });
3
IlludiumPu36

Я знаю, что есть уже много ответов но ради простоты я хотел бы добавить другой ответ, который является простым и понятным в котором мы не должны помнить коды клавиш и это также работает через все браузеры

document.getElementById('myinput').onkeydown = function(e)
 {
     console.log(e.key);
     //console.log(e.target.value);
     switch (e.key)
     {
         case "1":
         case "2":
         case "3":
         case "4":
         case "5":
         case "6":
         case "7":
         case "8":
         case "9":
         case "0":
         case "Backspace":
             return true;
             break;

         case ".":
             if (e.target.value.indexOf(".") == -1)
             {
                 return true;
             }
             else
             {
                 return false;
             }
             break;

         default:
             return false;
     }

 }
<input type="text" placeholder="Enter Value" id="myinput" />

2
vibs2006

Это вариант ответа Роберта, который позволяет ввести одну десятичную точку. Если десятичная точка уже введена, в качестве входных данных принимаются только цифры.

JSFiddle - ввод десятичного числа

// Allow only decimal number input

$('#decimalInput').keypress(function (e) {
    var a = [];
    var k = e.which;

    for (i = 48; i < 58; i++)
    a.Push(i);

    // allow a max of 1 decimal point to be entered
    if (this.value.indexOf(".") === -1) {
        a.Push(46);
    }

    if (!(a.indexOf(k) >= 0)) e.preventDefault();

    $('span').text('KeyCode: ' + k);
});
2
Jon Crowell

короче и легко понять

$('#someID').keypress(function(e) { 
    var k = e.which;
    if (k <= 48 || k >= 58) {e.preventDefault()};
});
2
ZAJDAN

это также позволит вводить данные на цифровой клавиатуре.

.keydown(function(event){                                     
    if(event.keyCode == 8 || event.keyCode == 46)             
        return true;                                         
    if(event.keyCode >= 96 && event.keyCode <= 105)           
        return true;                                          
    if(isNaN(parseInt(String.fromCharCode(event.keyCode),10)))
       return false;                                          
}); 
1
Yunus Eren Güzel

Стоит отметить, что независимо от того, насколько тщательно вы управляете этим через интерфейс (Javascript, HTML и т.д.), Вам все равно нужно проверить его на сервере, потому что ничто не мешает пользователю отключить JavaScript или даже преднамеренно отправлять нежелательные сообщения в вашу форму, чтобы попытаться взломать вас.

Мой совет: используйте разметку HTML5, чтобы браузеры, которые ее поддерживают, использовали ее. Также используйте предложенную ранее опцию JQuery (первоначальное решение может иметь недостатки, но кажется, что комментарии работали над этим). А затем выполните проверку на стороне сервера.

1
Spudley

Вот мое решение: сочетание рабочих ниже.

var checkInput = function(e) {
        if (!e) {
            e = window.event;
        }

        var code = e.keyCode || e.which;

        if (!e.ctrlKey) {

            //46, 8, 9, 27, 13 = backspace, delete, tab, escape, and enter
            if (code == 8 || code == 13 || code == 9 || code == 27 || code == 46)
                return true;
            //35..39 - home, end, left, right
            if (code >= 35 && code <= 39)
                return true;
            //numpad numbers
            if (code >= 96 && code <= 105)
                return true;
            //keyboard numbers
            if (isNaN(parseInt(String.fromCharCode(code), 10))) {
                e.preventDefault();
                return false;
            }
        }
        return true;
    };
1
Uygar

Я сталкивался с твоим вопросом, пытаясь понять это сам. Вот решение, которое я придумал.

// Prevent user from entering non-numeric characters in number boxes.
(function (inputs) {
    var input;
    var f = function (e) {
        var unicodeRe = /U\+(\d+)/;
        // Chrome doesn't support the standard key property, so use keyIdentifier instead.
        // Instead of the actual character that "key" returns, keyIdentifier returns
        // A string such as "U+004F" representing the unicode character.

        // For special characters (e.g., "Shift", a string containing the name of the key is returned.)
        var ch = e.key || e.keyIdentifier;
        var match = ch.match(unicodeRe);
        // keyIdentifier returns a unicode. Convert to string.
        if (match) {
            ch = String.fromCharCode(Number.parseInt(match[1], 16));
        }
        console.log(ch);
        if (ch.length === 1 && /[^0-9]/.test(ch)) {
            if (!/[\b]/.test(ch)) { // Don't prevent backspace.
                e.preventDefault();
            }
        }
    };
    for (var i = 0, l = inputs.length; i < l; i += 1) {
        input = inputs[i];
        input.onkeydown = f;
    }
}(document.querySelectorAll("input[type=number],#routeFilterBox")));

Правка: я обнаружил, что мое решение не позволяет пользователю вводить цифры с помощью цифровой клавиатуры в Chrome. Клавиши клавиатуры 0-9, кажется, возвращают символ "` "для 0 и A-I для остальных цифровых клавиш.

1
Jeff Jacobson

Мои функции:

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


$('.input_float_only').on('input', function(e) {
    var $var = $(this).val().replace(/[^0-9\.]/g, '');
    var $aVar = $var.split('.');

    if($aVar.length > 2) {
        $var = $aVar[0] + '.' + $aVar[1];
    }

    $(this).val($var);
});
1
Tin Nguyen

Чтобы заблокировать ввод любых значений, кроме цифр, в текстовое поле, но при этом разрешить работу других кнопок (таких как удаление, смещение, табуляция и т.д.), Посмотрите на ссылку на коды клавиш Javascript ; все от 65 до (до 222) может быть заблокировано. 

Используя Jquery и Javascript, это будет выглядеть так:

$('#textFieldId').keydown(function(event) {
    if ( event.keyCode > 64 ) {
        event.preventDefault();
    }
});

Коды клавиш будут одинаковыми в Javascript, независимо от того, используется Jquery или нет.

1
Asher Garland

Есть мое текущее решение числового ввода, нужно тестировать в разных браузерах, но, кажется, работает

Поддержка запятой и разделителя периодов (чешский - это запятая), ввод пробелов и чисел/клавиатуры. Разрешить Ctrl + C Ctrl + A или Ctrl + X, навигацию по стрелкам и удалить блок Ctrl + V. Реагируйте на клавишу выхода, размывая ввод.

Посмотрите мой сценарий Кофе:

(($) ->
  $.fn.onlyNumbers = ->
    @each ->
      $(@).keydown (e) ->
        # get code of key
        code = if e.keyCode then e.keyCode else e.which

        return $(@).blur() if code is 27 # blur on escape
        return if code in [46, 8, 9, 13] # 46, 8, 9, 27, 13 = backspace, delete, tab, escape, and enter
        return if (e.ctrlKey or e.metaKey) and code in [65, 67, 88] # ctrl|command + [a, c, x]
        return if code in [96..105] # numpad numbers
        return if code in [48..57] # numbers on keyboard
        return if code in [35..39] # 35..39 - home, end, left, right
        return if code in [188, 190, 32] # comma, period, space
        return if code in [44] # comma, period,

        e.returnValue = false # IE hate you
        e.preventDefault();

      $(@).keypress (e) ->
        code = if e.keyCode then e.keyCode else e.which
        return if code in [44, 46, 32] # comma, period, space
        return if code in [48..57] # numbers on keyboard
        e.returnValue = false # IE hate you
        e.preventDefault();

) jQuery

Вы можете получить скомпилированный Javascript здесь http://goo.gl/SbyhXN

0
OzzyCzech

Вы можете обработать событие в html, введя функцию keypresshandler

function keypresshandler(event)
{
     var charCode = event.keyCode;

     //You condition
     if (charCode == 58 ){

        event.preventDefault();

        return false;
     }        
} 
0
Priyanthi

Вы можете внести изменения, чтобы принять код клавиши для клавиш Ctrl: 17, 18, 19, 20 . Тогда ваш код будет выглядеть так:

function numbersonly(e, decimal) {
var key;
var keychar;

if (window.event) 
    key = window.event.keyCode;
else if (e) 
    key = e.which;
else 
    return true;

keychar = String.fromCharCode(key);

if ((key==null) || (key==0) || (key==8) ||  (key==9) || (key==13) || (key==27) || (key==17) || (key==18) || (key==19) || (key==20))
   return true;     
else if ((("0123456789").indexOf(keychar) > -1))
   return true;
else if (decimal && (keychar == "."))
   return true;        
else
   return false;
}
0
Bruno Silva

Javascript часто используется на стороне клиента браузера для выполнения простых задач, которые в противном случае потребовали бы полной обратной передачи на сервер. Многие из этих простых задач включают обработку текста или символов, введенных в элемент формы на веб-странице, и часто бывает необходимо знать код ключа javascript, связанный с символом. Вот ссылка.

Нажмите клавишу в текстовом поле ниже, чтобы увидеть соответствующий код ключа Javascript.

        function restrictCharacters(evt) {

            evt = (evt) ? evt : window.event;
            var charCode = (evt.which) ? evt.which : evt.keyCode;
            if (((charCode >= '48') && (charCode <= '57')) || (charCode == '44')) {
                return true;
            }
            else {
                return false;
            }
        }
Enter Text:
<input type="text" id="number" onkeypress="return restrictCharacters(event);" />

0
Mayur Narula

Это мой плагин для этого случая:

 (function( $ ) {
    $.fn.numbers = function(options) {
      $(this).keypress(function(evt){
          var setting = $.extend( {
                'digits' : 8
              }, options);
          if($(this).val().length > (setting.digits - 1) && evt.which != 8){
              evt.preventDefault(); 
          }
          else{
              if(evt.which < 48 || evt.which > 57){
                if(evt.keyCode != 8){
                    evt.preventDefault();  
                }
              }
          }
      });
    };
  })( jQuery );

Использование:

 $('#limin').numbers({digits:3});
 $('#limax').numbers();
0
jortsc

Вы можете сделать так, чтобы принимать только числа в текстовом поле

 function onChange(event){
   var ckeckChars = /[^0-9]/gi;
   if(checkChars.test(event.target.value)) {
        event.target.value = event.target.value.replace(ckeckChars,"");
  }
0
Venkatesh Somu
  document.getElementById('myinput').onkeydown = function(e) {
      if(!((e.keyCode > 95 && e.keyCode < 106)
      || (e.keyCode > 47 && e.keyCode < 58) 
      || e.keyCode == 8
      || e.keyCode == 9)) {
        return false;
      }
  }
0
user3121518