防止输入字符的输入型数与淘汰赛

Question

我必须阻止用户在淘汰赛的输入型文本中插入一个非数字值：

这里我的HTML：

<input data-bind="value: myModel.myNumber, valueUpdate: 'afterkeydown', event: { change: validateMyNumber }" type="number" /> 

这里的JS ：

self.validateMyNumber = function (data, event) { 
    var input = data.myModel.myNumber(); 
     if (input == "") 
     { 

     } 
}; 

我不能找到一些逻辑来validateMyNumber功能里面写的...当我按下按钮，它是不是一个数字我失去了我的模型旧值，我得到一个空字符串...在th电子文本框什么也没有改变... 我只是想如果我插入一个非数字值我必须阻止在文本框中插入...我该怎么办？

Answer 1

我使用这个作为input [type = number]元素的全局规则。你不需要任何具体的淘汰赛。

$(document).on('keypress change focus', 'input[type="number"]', function (e) { 
    var isKeypress = e.type === 'keypress'; 
    var isChange = e.type === 'change'; 
    var isFocus = e.type === 'focus' || e.type === 'focusin'; 
    var charTyped = String.fromCharCode(e.which); 
    var $el = $(this); 

    // store original value to revert change that invalidates min 
    if (isFocus) { 
     this.originalVal = $el.val(); 
     return; 
    } 

    // block invalid keystrokes 
    if (isKeypress) { 
     // don't allow non-numeric chars 
     if (!/^[\.0-9]$/.test(charTyped)) { 
      e.preventDefault(); 
      return; 
     } 

     // don't allow double periods (123.456.789) 
     if (charTyped === '.' && $el.val().indexOf('.') > -1) { 
      e.preventDefault(); 
      return; 
     } 
    } 

    // don't allow >max or <min values 
    if (isChange) { 
     var min = $el.attr('min'); 
     var max = $el.attr('max'); 
     var amt = parseInt($el.val() + charTyped); 

     if (max && amt > max || min && amt < min) { 
      // revert change 
      $el.val(this.originalVal); 
      $el.focus(); 
     } 
    } 
});