簡體   English   中英

表單文本字段僅接受數字和空格

[英]Form Text Field to ONLY accept numbers and whitespace

我的網站上有一個基本的查詢表格,我希望其中一個字段僅接受數字和鍵盤空格(空格)。

當前,電話號碼字段僅接受使用以下方式的號碼:

if(isNaN(form.phone.value)) 
{
alert('Due to SPAM this field will only accept numbers');
form.phone.focus();
return false;
}

當我測試表單並使用鍵盤空間時,將顯示錯誤消息。 我需要此字段來接受數字和空格。 我假設人們在輸入完整的電話號碼(包括國家/地區代碼)時會使用空格。

你可以這樣

 'use strict'; function addEvent(elem, event, fn) { if (typeof elem === 'string') { elem = document.getElementById(elem); } function listenHandler(e) { var ret = fn.apply(null, arguments); if (ret === false) { e.stopPropagation(); e.preventDefault(); } return ret; } function attachHandler() { window.event.target = window.event.srcElement; var ret = fn.call(elem, window.event); if (ret === false) { window.event.returnValue = false; window.event.cancelBubble = true; } return ret; } if (elem.addEventListener) { elem.addEventListener(event, listenHandler, false); } else { elem.attachEvent('on' + event, attachHandler); } } var keys = ' 0123456789'; function verify(e) { var key = String.fromCharCode(e.keyCode || e.charCode); return keys.indexOf(key) !== -1; } addEvent('test', 'keypress', verify); 
 <input id="test" type="text" /> 

更新:由於這些天所有東西都支持EventTarget.addEventListener ,因此您不需要所有其他樣板文件。 並且上面可以這樣寫。

 'use strict'; const element = document.getElementById('test'); const keys = ' 0123456789'; element.addEventListener('keypress', (e) => { if (keys.includes(e.key) === false) { e.stopPropagation(); e.preventDefault(); } }, false); 
 <input id="test" type="text" /> 

信息:

按鍵

的KeyboardEvent

Event.stopPropagation

Event.preventDefault

使用html5輸入type =“ tel”屬性( http://www.w3schools.com/tags/tag_input.asp )。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM