首頁 web前端 js教程 jquery限定文字方塊只能輸入數字(整數和小數)_jquery

jquery限定文字方塊只能輸入數字(整數和小數)_jquery

May 16, 2016 pm 03:21 PM
jquery 小數 數位 整數 文字方塊

本文實例介紹了jquery限定文字方塊只能輸入數字的詳細程式碼,分享給大家參考,具體內容如下

先來一段規定文字方塊只能夠輸入數字包含小數的jQuery程式碼:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="gb2312"> 
<title>脚本之家</title> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
//文本框只能输入数字(包括小数),并屏蔽输入法和粘贴 
jQuery.fn.number=function(){
 this.bind("keypress",function(e){ 
 var code=(e.keyCode&#63;e.keyCode:e.which); //兼容火狐 IE 
 //火狐下不能使用退格键 
 if(!$.browser.msie&&(e.keyCode==0x8)){return;} 
 if(this.value.indexOf(".")==-1){return (code >= 48 && code<= 57)||(code==46);}
 else{return code >= 48 && code<= 57} 
 }); 
 this.bind("paste",function(){return false;}); 
 this.bind("keyup",function(){
 if(this.value.slice(0,1) == ".")
 { 
  this.value = ""; 
 } 
 }); 
 this.bind("blur",function(){ 
 if(this.value.slice(-1) == ".")
 { 
  this.value = this.value.slice(0,this.value.length-1); 
 } 
 }); 
}; 
$(function(){ 
 $("#txt").number();
}); 
</script>
</head>
<body>
<input type="text" id="txt" />
</body>
</html>
登入後複製

2、jQuery如何規定文字方塊只能輸入整數:
有時候文字框的內容只能夠是數字,而且還只能夠是整數,例如年齡,你不能夠填寫20.8歲,下面就透過程式碼實例介紹一下如何實現此功能,希望給需要的朋友帶來幫助,程式碼如下:

<html> 
<head> 
<meta charset="gb2312"> 
<title>蚂蚁部落</title> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
//文本框只能输入数字(不包括小数),并屏蔽输入法和粘贴 
jQuery.fn.integer=function(){ 
 this.bind("keypress",function(e){ 
 var code=(e.keyCode&#63;e.keyCode:e.which); //兼容火狐 IE 
 //火狐下不能使用退格键 
 if(!$.browser.msie&&(e.keyCode==0x8))
 { 
  return ; 
 } 
 return code >= 48 && code<= 57; 
 }); 
 this.bind("paste",function(){ 
 return false; 
 }); 
 this.bind("keyup",function(){ 
 if(/(^0+)/.test(this.value)) 
 { 
 this.value = this.value.replace(/^0*/,''); 
 } 
 }); 
}; 
$(function(){ 
 $("#txt").integer();
}); 
</script>
</head>
<body>
<input type="text" id="txt" />
</body>
</html>
登入後複製

以上程式碼實現了我們的要求,在文字方塊中只能夠輸入整數。

希望本文所述對大家學習jquery程式設計有所幫助。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

jQuery中如何使用PUT請求方式? jQuery中如何使用PUT請求方式? Feb 28, 2024 pm 03:12 PM

jQuery中如何使用PUT請求方式?在jQuery中,發送PUT請求的方法與發送其他類型的請求類似,但需要注意一些細節和參數設定。 PUT請求通常用於更新資源,例如更新資料庫中的資料或更新伺服器上的檔案。以下是在jQuery中使用PUT請求方式的具體程式碼範例。首先,確保引入了jQuery庫文件,然後可以透過以下方式發送PUT請求:$.ajax({u

jQuery小技巧:快速修改頁面所有a標籤的文本 jQuery小技巧:快速修改頁面所有a標籤的文本 Feb 28, 2024 pm 09:06 PM

標題:jQuery小技巧:快速修改頁面所有a標籤的文字在網頁開發中,我們經常需要對頁面中的元素進行修改和操作。使用jQuery時,有時候需要一次修改頁面中所有a標籤的文字內容,這樣可以節省時間和精力。以下將介紹如何使用jQuery快速修改頁面所有a標籤的文本,同時給出具體的程式碼範例。首先,我們需要引入jQuery庫文件,確保在頁面中引入了以下程式碼:&lt

使用jQuery修改所有a標籤的文字內容 使用jQuery修改所有a標籤的文字內容 Feb 28, 2024 pm 05:42 PM

標題:使用jQuery修改所有a標籤的文字內容jQuery是一款受歡迎的JavaScript庫,被廣泛用於處理DOM操作。在網頁開發中,經常會遇到需要修改頁面上連結標籤(a標籤)的文字內容的需求。本文將介紹如何使用jQuery來實現這個目標,並提供具體的程式碼範例。首先,我們需要在頁面中引入jQuery庫。在HTML檔案中加入以下程式碼:

PHP時間戳轉換為整數的方法 PHP時間戳轉換為整數的方法 Mar 20, 2024 pm 04:24 PM

PHP中時間戳記是一種表示時間的整數形式,通常是自Unix元年(1970年1月1日00:00:00GMT)起經過的秒數。在程式設計中,我們經常需要將時間戳記轉換為其他形式的整數,以下就為大家介紹如何將PHP時間戳轉換為整數的方法,以及具體的程式碼範例。在PHP中,我們可以使用strtotime()函數將時間字串轉換為時間戳,然後再使用date

如何判斷jQuery元素是否具有特定屬性? 如何判斷jQuery元素是否具有特定屬性? Feb 29, 2024 am 09:03 AM

如何判斷jQuery元素是否具有特定屬性?在使用jQuery操作DOM元素時,常會遇到需要判斷元素是否具有某個特定屬性的情況。在這種情況下,我們可以藉助jQuery提供的方法來輕鬆實現這項功能。以下將介紹兩種常用的方法來判斷一個jQuery元素是否具有特定屬性,並附上具體的程式碼範例。方法一:使用attr()方法和typeof運算子//判斷元素是否具有特定屬

真我 GT Neo6 定檔 5 月 9 日!機圈首場 AI 數位人發表會 真我 GT Neo6 定檔 5 月 9 日!機圈首場 AI 數位人發表會 May 08, 2024 pm 12:49 PM

5月7日,我手機廠商正式宣布,本公司GTNeo6發表會定檔5月9日。我GTNoe6被定位為"性能風暴",旨在攪動中端機風雲。除此之外,該發表會也將是手機圈首場AI數位人發表會。屆時,真我realme副總裁、全球行銷總裁、中國區總裁徐起將以數位人的形式出現在發表會上。數位人徐起根據官方介紹,真我GTNoe6代號為"颶風",更快更強,將挑戰最強第三代驍龍8s旗艦,挑戰同檔最強產品力。日前,真我GTNeo6被發現直接在電商平台上架,部分核心配置曝光,顯示該機不僅搭載了驍龍8s處理器,還支援120W閃充

使用jQuery為表格新增一行的方法介紹 使用jQuery為表格新增一行的方法介紹 Feb 29, 2024 am 08:12 AM

jQuery是一個受歡迎的JavaScript函式庫,廣泛用於網頁開發。在網頁開發過程中,經常需要透過JavaScript動態地在表格中新增一行。本文將介紹如何使用jQuery為表格新增一行,並提供具體的程式碼範例。首先,我們需要在HTML頁面中引入jQuery函式庫。可以透過以下程式碼在標籤中引入jQuery庫:

PHP判斷數字位數的方法及應用 PHP判斷數字位數的方法及應用 Mar 27, 2024 pm 08:21 PM

PHP是一種流行的伺服器端腳本語言,廣泛用於開發網頁應用程式。在Web開發中,經常會遇到需要判斷數字的位數的情況,本文將介紹PHP判斷數字位數的方法及其應用,並提供具體的程式碼範例。一、判斷數字位數的方法在PHP中,判斷一個數字的位數可以透過多種方法實現,以下是常用的幾種方法:使用內建函數strlen():可以直接將數字轉為字串,然後使用strlen()函

See all articles