顯示自定義消息而不是網頁上的詳細消息

Question

下面的html代碼只接受數字作爲輸入，但我注意到在一些場景中，它也接受字符，例如當輸入數字和輸入退格鍵，然後鍵入字符它正在接受這些信件。

<input type="number" class="form-control" name="digitalId" ng-model="data.digitalId" placeholder="digits can only be entered"> </div> 

當用戶提交表單時，上面的字段值存儲在列的整型數據庫中。但是，當它接受字符並提交表單時，它將在屏幕上顯示錯誤消息，但消息是關於DTO對象和屬性類型的詳細消息。當用戶提交表單並且該字段中有一些字符時，我想將自定義消息顯示爲「僅允許數字」。任何的意見都將會有幫助。

Answer 1

這是基於這樣它可以與角被用作良好，無jquery的使用純javascript

function validate(evt) { 
 
    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) { 
 
    console.log("only numbers allowed"); 
 
    theEvent.preventDefault(); 
 
    } 
 
    
 
    } 
 
}

<input type="number" class="form-control" name="digitalId" ng-model="data.digitalId" placeholder="digits can only be entered" onkeypress="validate(event)"> </div>

A reference from this answer: