我正在尝试创建一个文本框，它只允许使用打字稿的数字。见下面的例子

Question

我想使用打字稿创建一个允许输入数字的文本框。

文本框-alpha.ts

    import {bindable} from 'aurelia-framework';

export class textboxNumber {

@bindable public allownumber : number;
} 
  function onlynumber(allownumber) {
    allownumber = (allownumber) ? allownumber : event;
    var charCode = (allownumber.charCode) ? allownumber.charCode : ((allownumber.keyCode) ? allownumber.keyCode :
  ((allownumber.which) ? allownumber.which : 0));
    if (charCode > 31 && (charCode < 65 || charCode > 90) &&
    (charCode < 97 || charCode > 122)) {

        return false;
    }
    return true;
  }

文本框-alpha.html

<input type="text" onkeypress="onlynumber(allownumber)" required />

Answer 1

没有必要为此创建自定义元素，因为有一个内置的输入类型。

<input type="number" />

Answer 2

使用 pattern 属性验证表单提交时的输入并让浏览器完成工作。

const form = document.querySelector('form');

form.addEventListener('submit', e => {
  // preventing the form from being submitted so that multiple inputs can be tested
  e.preventDefault();
  alert('submit');
});

<form>
<input type="text" pattern="-?\d*" title="Value must be an integer" required />
<input type="submit" value="submit" />
</form>

我正在尝试创建一个文本框，它只允许使用打字稿的数字。见下面的例子

I am trying to create a text box which allows only numbers using typescripts. See below example

typescript

aurelia

文本框-alpha.ts

文本框-alpha.html