Limit input type (multiple methods)

Limit input type (multiple methods)
1. Only Chinese characters can be input and pasted
<input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"><br/>

3. Only numbers can be entered and pasted
<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" /><br/>
5. Digital Script
<input onkeyup="if(/\D/.test(this.value)){alert('Only numbers can be entered');this.value='';}"><br/>

6. Only numbers and English can be entered
<input onkeyup="value=value.replace(/[\W]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"><br/>

8. Simple prohibition of inputting Chinese characters
<input style="ime-mode:disabled">Input method is not converted, but can be pasted<br/>

9. Enter numbers and decimal points
<input onkeyup="value=value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g,'')" /><br/>

10. Only numbers and "-", for example, can be used when entering time
<input onkeyup="value=value.replace(/[^\w&=]|_/ig,'')" onblur="value=value.replace(/[^\w&-]|_/ig,'')" />

JS controls input character limit

The ENTER key moves the cursor to the next input box.

Copy code
The code is as follows:

<input onkeydown="if(event.keyCode==13)event.keyCode=9" > can only be Chinese
<input onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9"> Block input method <input style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9"> Only English and numbers can be entered
<input onkeyup="value=value.replace(/[/W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))" onkeydown="if(event.keyCode==13)event.keyCode=9"> Can only be numbers
<input onkeyup="value=value.replace(/[^/d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))">

Can only be displayed, not edited

Copy code
The code is as follows:

<input readonly value="can only be displayed, cannot be modified"> can only enter numbers, determine the value of the button
<script language=javascript>
function onlyNum()
{
if(!((event.keyCode>=48&&event.keyCode<=57)||(event.keyCode>=96&&event.keyCode<=105)||(event.keyCode==8)))
event.returnValue=false;
}
</script>
<input onkeydown="onlyNum();">

1. Only numeric codes can be entered in the text box (decimal points cannot be entered)
<input onkeyup="this.value=this.value.replace(//D/g,'')" onafterpaste="this.value=this.value.replace(//D/g,'')">

2. Only numbers can be entered, and decimal points can be entered.
<input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')">
<input name=txt1 onchange="if(//D/.test(this.value)){alert('Only numbers can be entered');this.value='';}">

3. Numbers and decimal point method 2

Copy code
The code is as follows:

<input type=text t_value="" o_value="" onkeypress="if(!this.value.match(/^[/+/-]?/d*?/.?/d*?$/))this.value=this.t_value;else this.t_value=this.value;if(this.value.match(/^(?:[/+/-]?/d+(?:/./d+)?)?$/))this.o_value=this.value" onkeyup="if(!this.value.match(/^[/+/-]?/d*?/.?/d*?$/))this.value=this.t_value;else this.t_value=this.value;if(this.value.match(/^(?:[/+/-]?/d+(?:/./d+)?)?$/))this.o_value=this.value" onblur="if(!this.value.match(/^(?:[/+/-]?/d+(?:/./d+)?|/./d*?)?$/))this.value=this.o_value;else{if(this.value.match(/^/./d+$/))this.value=0+this.value;if(this.value.match(/^/.$/))this.value=0;this.o_value=this.value}">

4. Only letters and Chinese characters can be input
<input onkeyup="value=value.replace(/[/d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[/d]/g,''))" maxlength=10 name="Numbers">

5. Only English letters and numbers can be entered, Chinese characters cannot be entered
<input onkeyup="value=value.replace(/[^/w/.//]/ig,'')">

6. Only numbers and English can be entered
<font color="Red">chun</font>
<input onKeyUp="value=value.replace(/[^/d|chun]/g,'')">
7. There can be at most two digits after the decimal point (numbers and Chinese characters can be entered), and letters and operation symbols cannot be entered: <input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || //./d/d$/.test(value))event.returnValue=false">8. There can be at most two digits after the decimal point (numbers, letters, and Chinese characters can be entered), and operation symbols can be entered:
<input onkeyup="this.value=this.value.replace(/^(/-)*(/d+)/.(/d/d).*$/,'$1$2.$3')">
Only numbers, decimal points, addition, subtraction, and multiplication can be used.
9. Only numbers, decimal points, and negative numbers can be entered

Copy code
The code is as follows:

<input name="input" type="text" onkeyup="JHshNumberText(this)" id="title">

<script language="javascript" type="text/javascript">function JHshNumberText(a)
{
var fa="";
if(a.value.substring(0,1)=="-")
fa="-";
var str=(a.value.replace(/[^0-9.]/g,'')).replace(/[.][0-9]*[.]/, '.');
if (str.substring(0,1)==".")
str="0"+str;
a.value=fa+str;
}
</script>

1. To cancel the dotted box when the button is pressed, add the attribute value hideFocus or HideFocus=true in the input
<input type="submit" value="Submit" hidefocus="true" />

2. To read only the text box content, add the attribute value readonly in input
<input type="text" readonly />

3. Prevent the TEXT document from being cleared after going back (the style content can be used as a class reference)
<input type="text" style="behavior:url(#default#savehistory);" />

4. The ENTER key moves the cursor to the next input box
<input type="text" onkeydown="if(event.keyCode==13)event.keyCode=9" />

5. Only Chinese (flashing)
<input type="text" onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9" />

6. Only numbers (flashing)
<input type="text" onkeyup="value=value.replace(/[^/d]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))" />

7. Only numbers (no flashing)
<input type="text" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" onkeypress="if ((event.keyCode<48 || event.keyCode>57)) event.returnValue=false" />

8. Only English and numbers can be entered (with flashing)
<input type="text" onkeyup="value=value.replace(/[/W]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))" />

9. Block input method
<input type="text" name="url" style="ime-mode: disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" />

10. Only numbers, decimal points, and minus signs (-) can be entered (no flashing)
<input onkeypress="if (event.keyCode!=46 && event.keyCode!=45 && (event.keyCode<48 || event.keyCode>57)) event.returnValue=false" />

11. Only two decimal places or three decimal places can be entered (flashing)
<input type="text" maxlength="9" onkeyup="if(value.match(/^/d{3}$/))value=value.replace(value,parseInt(value/10)) ;value=value.replace(//./d*/./g,'.')" onkeypress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 && event.keyCode!=45 || value.match(/^/d{3}$/) || //./d{3}$/.test(value)) {event.returnValue=false}" />

<<:  A brief discussion on the correct approach to MySQL table space recovery

>>:  How to write the Nofollow tag and how to use it

Recommend

An article to master MySQL index query optimization skills

Preface This article summarizes some common MySQL...

Docker Compose network settings explained

Basic Concepts By default, Compose creates a netw...

MySQL InnoDB transaction lock source code analysis

Table of contents 1. Lock and Latch 2. Repeatable...

18 sets of exquisite Apple-style free icon materials to share

Apple Mug Icons and Extras HD StorageBox – add on...

A brief discussion on Yahoo's 35 rules for front-end optimization

Abstract: Whether at work or in an interview, opt...

Complete steps to configure a static IP address for a Linux virtual machine

Preface In many cases, we will use virtual machin...

Vue implements a scroll bar style

At first, I wanted to modify the browser scroll b...

Vue3.0 project construction and usage process

Table of contents 1. Project construction 2: Dire...

Vue-cli creates a project and analyzes the project structure

Table of contents 1. Enter a directory and create...

In-depth understanding of the vertical-align property and baseline issues in CSS

vertical-align attribute is mainly used to change...

Detailed explanation of how to quickly build a blog website using Docker

Table of contents 1. Preparation 2. Deployment Pr...

A brief discussion on the placement of script in HTML

I used to think that script could be placed anywh...

JavaScript canvas to achieve raindrop effect

This article example shares the specific code for...

More than 100 lines of code to implement react drag hooks

Preface The source code is only more than 100 lin...

HTML table markup tutorial (48): CSS modified table

<br />Now let's take a look at how to cl...