のcontentEditable要素

Question

JSFiddleに入力されてから数字を停止する方法：

https://jsfiddle.net/mqfntbws/は私が特殊文字や数字を入力してからユーザーを防ぐために、先のcontenteditable spanを持っています。問題は、私は特殊文字を防ぐことができますが、数値には作用しないということです。誰でも私が間違っていることを知っている？

HTML：

<span required="" contenteditable="" placeholder="First Name" aria-required="true"></span> 

JS：

$('span[contenteditable]').on('keypress', function (event) { 
     var regex = new RegExp("^[A-z]+$"); 
      var key = String.fromCharCode(!event.charCode ? event.which : event.charCode); 
      if (!regex.test(key) && !((event.keyCode>=46 && event.keyCode<=58) || event.keyCode==8 || event.keyCode==9 || (event.keyCode>=37 && e.keyCode<=40))) { 
     console.log(">>>"); 
       event.preventDefault(); 
       return false; 
      } 
}); 

Answer 1

あなたはjQueryのを使用しているように見えるとして、あなたはAPI内isNumeric()機能をフルに活用することができます。 documentationから

：

その引数が数値を表しているかどうかを$ .isNumeric（）メソッドをチェックします。そうであれば、trueを返します。それ以外の場合はfalseを返します。引数の型は任意です。

したがって、これを使用すると、ifという文が大幅に消去されます。

if(!regex.test(key) || $.isNumeric(key)) 

次であなたを残し：

$('span[contenteditable]').on('keypress', function (event) { 

    var regex = new RegExp("^[A-z]+$"); 
    var key = String.fromCharCode(event.which); 

    if (!regex.test(key) || $.isNumeric(key)) { 

     event.preventDefault(); 
     return false; 
    } 
}); 

私は作業例を使用して、元のフィドルをフォークして更新しました：https://jsfiddle.net/GH05T/mqfntbws/6/