JavaScript中僅匹配數字的正則表示式?
在本教程中,我們將學習在 JavaScript 中使用正則表示式僅匹配數字。
資料是每個網頁的核心元素。我們必須根據要求對其進行驗證。我們經常處理資料,並需要使用者提供正確的輸入。例如,使用者不能在接受電話號碼的欄位中輸入字母,或者輸入長度應為十位數字。
為了驗證 JavaScript 中的資料,可以使用正則表示式。我們經常需要過濾必要的資料並提取匹配的資料。在這裡,我們將從資料中匹配所有數字。
因此,讓我們看看在 JavaScript 中僅匹配數字的正則表示式。
使用正則表示式
我們將使用正則表示式從資料中僅匹配數字。正則表示式只是具有含義的字元模式。此模式檢查資料並返回已檢查的資料。
它由模式和修飾符組成。模式由字元或字元範圍組成,修飾符就像一種方法,可以賦予模式某些特性,例如忽略大小寫等等。
我們可以使用 match() 方法返回與正則表示式匹配的資料。否則,test() 方法將返回一個布林值,表示資料中是否找到了匹配項。
所有使用者都可以遵循語法來使用正則表示式在 JavaScript 中僅匹配數字
語法
//syntax of regular expressions
/pattern/modifier(s);
//Regular expression to match numbers only
var <Pattern> = /\d+/g ;
OR
var <Pattern> = new RegExp('^[0-9]+$');
'<your string here>'.match( <Pattern> );
按照上述語法在 JavaScript 中僅匹配數字
示例 1
在本例中,我們使用了正則表示式來僅從文字中匹配數字。我們從使用者那裡獲取輸入作為文字字串。透過使用 match 方法,我們匹配了正則表示式和使用者提供的字串。返回值將是僅從使用者提供的數值中提取的數字。
<html> <body> <h2> Using the <i> Regular expression </i> to match numbers only in JavaScript </h2> <label for="number"> Add a number: </label> <input type="text" id="number" name="Number" value="" /> <button id="btn"> Submit </button> <div id="div"> </div> <script> document.getElementById("btn").addEventListener("click", func); var element = document.getElementById("div"); function func() { var value = document.getElementById("number").value; var regexp = /\d/g; var para = document.createElement('p'); para.innerHTML = "Numbers containing in the Text: " + value.match(regexp); element.appendChild(para); } </script> </body> </html>
在上面的示例中,使用者可以看到我們使用正則表示式從字串中僅匹配了數字,並在螢幕上顯示了這些數字。
示例 2
在下面的示例中,我們使用了輸入欄位來獲取使用者的手機號碼。輸入欄位可以接受文字和數字作為輸入。我們將驗證使用者提供的數值不應包含字母。電話號碼不包含字母。因此,我們正在驗證使用者提供的資料。
<html> <body> <h2> Using the <i> Regular expression </i> to match numbers only in JavaScript </h2> <div id="div"> <label for="text"> Enter mobile number : </label> <input type="text" id="text" name="Text" value="" /> </div> <button id="btn"> Submit </button> <script> document.getElementById("btn").addEventListener("click", func); var element = document.getElementById("div"); function func() { var value = document.getElementById("text").value; var expression = new RegExp('^[0-9]+$'); if (document.getElementById("para")) { document.getElementById("para").remove(); } if (!expression.test(value)) { var para = document.createElement('span'); para.innerHTML = " **Mobile number does not contain letters"; para.style.color = "red"; para.id = "para"; element.appendChild(para); } else { var para = document.createElement('span'); para.innerHTML = "**Currect input, you can proceed"; para.style.color = "red"; para.id = "para"; element.appendChild(para); } } </script> </body> </html>
在上面的示例中,使用者可以看到我們使用了正則表示式來驗證使用者提供的資料。在本例中,我們只接受數字。
在本教程中,我們學習了在 JavaScript 中使用正則表示式僅匹配數字。
資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP