jQuery實現(xiàn)只允許輸入數(shù)字和小數(shù)點的方法
本文實例講述了jQuery實現(xiàn)只允許輸入數(shù)字和小數(shù)點的方法。分享給大家供大家參考,具體如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
//示例代碼:
//只允許輸入數(shù)字與.:<input type="text" name="test" id="test" onkeydown="checkKeyForFloat(this.value,event)" style="ime-mode: disabled" />
//只允許輸入數(shù)字 :<input type="text" name="test2" id="test2" onkeydown="checkKeyForNum(this.value,event)" style="ime-mode: disabled" />
//只允許輸入數(shù)字與小數(shù)點
function checkKeyForFloat(value, e) {
var isOK = false;
var key = window.event ? e.keyCode : e.which;
if ((key > 95 && key < 106) || //小鍵盤上的0到9
(key > 47 && key < 60) || //大鍵盤上的0到9
(key == 110 && value.indexOf(".") < 0) || //小鍵盤上的.而且以前沒有輸入.
(key == 190 && value.indexOf(".") < 0) || //大鍵盤上的.而且以前沒有輸入.
key == 8 || key == 9 || key == 46 || key == 37 || key == 39 //不影響正常編輯鍵的使用(8:BackSpace;9:Tab;46:Delete;37:Left;39:Right)
) {
isOK = true;
} else {
if (window.event) //IE
{
e.returnValue = false; //event.returnValue=false 效果相同.
}
else //Firefox
{
e.preventDefault();
}
}
return isOK;
}
//只允許輸入數(shù)字
function checkKeyForInt(value, e) {
var isOK = false;
var key = window.event ? e.keyCode : e.which;
if ((key > 95 && key < 106) || //小鍵盤上的0到9
(key > 47 && key < 60) || //大鍵盤上的0到9
key == 8 || key == 9 || key == 46 || key == 37 || key == 39 //不影響正常編輯鍵的使用(8:BackSpace;9:Tab;46:Delete;37:Left;39:Right)
) {
isOK = true;
} else {
if (window.event) //IE
{
e.returnValue = false; //event.returnValue=false 效果相同.
}
else //Firefox
{
e.preventDefault();
}
}
return isOK;
}
//設置有自定義屬性 dtype 的文本框 允許輸入的范圍
function setDType() {
$(":text[dtype]").each(function () {
var dtype = $(this).attr("dtype");
var isOK = true;
switch (dtype) {
case "number":
$(this).css("ime-mode", "disabled").keydown(function (event) {
isOK = checkKeyForFloat($(this).val(), event);
if (!isOK) {
//$(this).SuperFocus("", 500);
}
return isOK;
});
break;
default:
break;
}
});
}
</script>
<script type="text/javascript">
$(function () {
setDType();
});
</script>
</head>
<body>
年齡: <input type="text" maxlength="3" onkeydown="checkKeyForInt(this.value,event)" style="ime-mode: disabled"/><br />
身高:<input type="text" maxlength="5" dtype="number" />
</body>
</html>
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jQuery拖拽特效與技巧總結(jié)》、《jQuery擴展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》、《jQuery動畫與特效用法總結(jié)》、《jquery選擇器用法總結(jié)》及《jQuery常用插件及用法總結(jié)》
希望本文所述對大家jQuery程序設計有所幫助。
- 基于jQuery實現(xiàn)文本框只能輸入數(shù)字(小數(shù)、整數(shù))
- jquery限定文本框只能輸入數(shù)字(整數(shù)和小數(shù))
- jquery判斷小數(shù)點兩位和自動刪除小數(shù)兩位后的數(shù)字
- jquery教程限制文本框只能輸入數(shù)字和小數(shù)點示例分享
- jquery限定文本框只能輸入數(shù)字即整數(shù)和小數(shù)
- jQuery使用正則表達式限制文本框只能輸入數(shù)字
- jQuery實現(xiàn)移動端滑塊拖動選擇數(shù)字效果
- 高效的jquery數(shù)字滾動特效
- 基于jQuery實現(xiàn)動態(tài)數(shù)字展示效果
- Jquery數(shù)字上下滾動動態(tài)切換插件
- jquery實現(xiàn)鼠標拖拽滑動效果來選擇數(shù)字的方法
- 利用jquery實現(xiàn)驗證輸入的是否是數(shù)字、小數(shù),包含保留幾位小數(shù)
相關(guān)文章
jQuery實現(xiàn)的fixedMenu下拉菜單效果代碼
這篇文章主要介紹了jQuery實現(xiàn)的fixedMenu下拉菜單效果代碼,通過自定義fixedMenu方法實現(xiàn)點擊下拉菜單效果,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
jQuery實現(xiàn)鼠標點擊處心形漂浮的炫酷效果示例
這篇文章主要介紹了jQuery實現(xiàn)鼠標點擊處心形漂浮的炫酷效果,涉及jQuery事件響應及頁面元素屬性動態(tài)變換相關(guān)操作技巧,需要的朋友可以參考下2018-04-04
輕松使用jQuery雙向select控件Bootstrap Dual Listbox
這篇文章主要教大家如何輕松使用jQuery雙向select控件Bootstrap Dual Listbox,感興趣的小伙伴們可以參考一下2015-12-12
牛叉的Jquery——Jquery與DOM對象的互相轉(zhuǎn)換及DOM的三種操作
Jquery對象就是通過jQuery包裝DOM對象后產(chǎn)生的對象,jQuery對象是jQuery獨有的,其可以使用jQuery里的方法,本文給大家介紹Jquery對象就是通過jQuery包裝DOM對象后產(chǎn)生的對象,jQuery對象是jQuery獨有的,其可以使用jQuery里的方法。感興趣的朋友可以參考下2015-10-10

