简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > HTML Tutorial > body text

How to restrict the HTML text box input to only numbers and decimal points

高洛峰
Release： 2017-03-28 09:48:55
Original
3050 people have browsed it

This article mainly introduces the method of restricting the input of HTML text box to only numbers and decimal points. Has very good reference value. Let’s take a look with the editor below

Code: 

<input type="text" class="txt" name="qty" value="" onkeyup="this.value=this.value.replace(/[^0-9\.]/g,&#39;&#39;)" />
Copy after login

PS: js realizes that only numbers can be entered and decimal point text box

<html><head><meta http-equiv="content-Type" content="text/html;charset=gb2312"><title>js 只能输入数字和小数点</title>
<script language="JavaScript" type="text/javascript">
function clearNoNum(obj){   obj.value = obj.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符  
 obj.value = obj.value.replace(/^\./g,"");  //验证第一个字符是数字而不是. 
  obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的.   
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
</script>
</head><body>只能输入数字和小数点的文本框：<input name="input1" onkeyup="clearNoNum(this)"></body></html>
Copy after login

The above is the detailed content of How to restrict the HTML text box input to only numbers and decimal points. For more information, please follow other related articles on the PHP Chinese website!

Related labels：
input
source：php.cn
Previous article：Example code for horizontally and vertically centered display of the content of a table in HTML Next article：Summary of div design in html
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Preserve caret position in HTML contenteditable when inner HTML changes I have a div that acts as a WYSIWYG editor. It acts as a text box but renders Markdown syn...
From 2023-11-08 22:38:23
0
2
285
Vue js: Troubleshooting - Reading '$refs' property of undefined Getting the error Cannot read property of undefined (reading '$refs') even though I have a...
From 2023-11-07 23:34:12
0
1
305
How to trigger input focus event inside method in Vue.js? I have an input that uses the following event: <b-nputclass="input"id="l...
From 2023-10-29 23:56:42
0
2
270
Ways to protect form from button submission On the next page, using Firefox, removing the button submits the form, but adding the butt...
From 2023-10-10 10:47:12
0
1
309
Select jQuery element $input._flatpicker input by flatpickr I'm using jquery in my project and I'm using flatpickr to place a date dropdown box. I nee...
From 2023-09-17 15:41:09
0
1
337
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！