資訊家電班NO7 - Powered by Discuz! Board

標題: [java/VB script] input輸入框只允許中文漢字、數字、整數等方法 [打印本頁]

作者: gswdkimo 時間: 2011-10-26 15:22 標題: input輸入框只允許中文漢字、數字、整數等方法

其一，只允許輸入數字和小數點。
<input onKeypress="return (/[\d.]/.test(String.fromCharCode(event.keyCode)))" style="ime-mode:Disabled">

其二，判斷的更詳細一些，甚至22..2這樣不算數字也判斷得出來
<script>
function check(){
if (isNaN(tt.value))
{alert("非法字符！");
tt.value="";}
}
</script>
<input type="text" name="tt" onkeyup="check();">

其三，只允許輸入整數。其實也完全可以根據第三條來舉一反三做一些限制。
<script language=javascript>
function onlyNum()
{
if(!(event.keyCode==46)&&!(event.keyCode==8)&&!(event.keyCode==37)&&!(event.keyCode==39))
if(!((event.keyCode>=48&&event.keyCode<=57)||(event.keyCode>=96&&event.keyCode<=105)))
event.returnValue=false;
}
</script>

<input onkeydown="onlyNum();" style="ime-mode:Disabled">
結語,其實
style="ime-mode:Disabled"
這句是比較實用的。意為關閉輸入法。省得有些人開著全角輸入數字，結果輸入不進去來找你哭天抹淚的，還怪你設計的不好。

只允許輸入數字
<input name="username" type="text" onkeyup="value=this.value.replace(/\D+/g,'')">

只允許輸入英文字母、數字和下劃線(以下二種方法實現)
<input name="username" type="text" style="ime-mode:disabled">
<input name="username" type="text" onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">

只允許輸入英文字母、數字和&=@
<input name="username" type="text" onkeyup="value=value.replace(/[^\w=@&]|_/ig,'')">

只允許輸入漢字
<input name="username" type="text" onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')">

<input name="username" type="text" style="ime-mode:disabled">
<input name="username" type="text" onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">

只允許輸入英文字母、數字和&=@
<input name="username" type="text" onkeyup="value=value.replace(/[^\w=@&]|_/ig,'')">

只允許輸入漢字
<input name="username" type="text" onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')">

只允許輸入數字+小數點
<input name="username" type="text" onkeyup="value=value.replace(/((1|0?)[0-9]|2[0-3]):([0-5][0-9])/g,'')">

作者: gswdkimo 時間: 2011-11-10 10:39

轉貼自http://demo.tc/Post/617

HTML的 Input 是這樣下滴

<input type="text" style="ime-mode:disabled" onkeyup="return ValidateNumber($(this),value)" />

複製代碼

注意事項

其中那個 Style 是在 IE 瀏覽器下有效用的，可以讓使用者無法在這文字方塊內使用輸入法。
而onkeyup 則是我們自己撰寫的 js 啦，完整的 Code 在下面。

驗證只能輸入數字

function ValidateNumber(e, pnumber)
{
if (!/^\d+$/.test(pnumber))
{
$(e).val(/^\d+/.exec($(e).val()));
}
return false;
}

複製代碼

注意事項demo 是利用 Regex 來將不屬於數字的過濾掉。

實務上經常需要驗證的是有小數點的欄位，網路上搜尋到的一堆是可以輸入「1.2.3456」的這種詭異值，其實只要小改一下 Regex 就可以驗證了。

function ValidateFloat(e, pnumber)
{
if (!/^\d+[.]?\d*$/.test(pnumber))
{
$(e).val(/^\d+[.]?\d*/.exec($(e).val()));
}
return false;
}

複製代碼

這樣子就可以輸入整數也可以輸入一個小數點
=============================================================
因為有網友說這種玩意兒不需要動用到 jQuery 的確，是不用動用到所以來寫一下純 javascript 的版本

●HTML要有所改變

<input type="text" style="ime-mode:disabled" onkeyup="return ValidateNumber(this,value)" />

複製代碼

只能輸入數字（純 javascript)

function ValidateNumber(e, pnumber)
{
if (!/^\d+$/.test(pnumber))
{
e.value = /^\d+/.exec(e.value);
}
return false;
}

複製代碼

●可以輸入小數（純 javascript)

function ValidateNumber(e, pnumber)
{
if (!/^\d+[.]?\d*$/.test(pnumber))
{
e.value = /^\d+[.]?\d*/.exec(e.value);
}
return false;
}

複製代碼

有網友說他想要限制只有小數點後一位就好，因此再來小改一下其實重點只有RegExp要改而已

function ValidateFloat2(e, pnumber)
{
if (!/^\d+[.]?[1-9]?$/.test(pnumber))
{
e.value = /\d+[.]?[1-9]?/.exec(e.value);
}
return false;
}

複製代碼

●如果你是用萬惡的IE那當你一開始就輸入非數字的時候就會送你一個討厭的null因此又要改寫成這樣過濾掉

if (!/^\d+$/.test(pnumber))
{
var newValue = /^\d+/.exec(e.value);
if (newValue != null)
{
e.value = newValue;
}
else
{
e.value = "";
}
}
return false;

複製代碼

歡迎光臨資訊家電班NO7 (http://imce07.freehostia.com/forums/)