Web Front-end
JS Tutorial
How to implement regular verification input of mobile phone number using jQuery
How to implement regular verification input of mobile phone number using jQuery
This article mainly introduces the jQuery implementation of mobile phone number regular verification input and automatic space filling functions, involving jQuery event response, string traversal and regular judgment and other related operating skills. Friends in need can refer to it
This article describes the example of jQuery's implementation of regular verification input and automatic filling of spaces for mobile phone numbers. Share it with everyone for your reference, the details are as follows:
Let’s take a look at the running effect first (you can delete it continuously when deleting):
Specific code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text" id="inp">
<script src="jquery-1.12.3.min.js"></script>
<script>
$(function(){
$("#inp").keyup(function(){
/*
手机号验证时：
var pattern = /^1[3|4|5|7|8]\d{1}\s\d{4}\s\d{4}$/;
pattern.test(str);
*/
_self = $(this);
if(_self.val().length == 3 || _self.val().length == 8){
var str = _self.val()+" ";
_self.val(str);
}
});
});
</script>
</body>
</html>The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
Use the http module to send requests through nodejs (detailed tutorial)
How to implement a table using jQuery CSS
How to use Vue to implement the comment framework
The above is the detailed content of How to implement regular verification input of mobile phone number using jQuery. For more information, please follow other related articles on the PHP Chinese website!
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
AI Hentai Generator
Generate AI Hentai for free.
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
1378
52
How to use Xiaohongshu account to find users? Can I find my mobile phone number?
Mar 22, 2024 am 08:40 AM
With the rapid development of social media, Xiaohongshu has become one of the most popular social platforms. Users can create a Xiaohongshu account to show their personal identity and communicate and interact with other users. If you need to find a user’s Xiaohongshu number, you can follow these simple steps. 1. How to use Xiaohongshu account to find users? 1. Open the Xiaohongshu APP, click the "Discover" button in the lower right corner, and then select the "Notes" option. 2. In the note list, find the note posted by the user you want to find. Click to enter the note details page. 3. On the note details page, click the "Follow" button below the user's avatar to enter the user's personal homepage. 4. In the upper right corner of the user's personal homepage, click the three-dot button and select "Personal Information"
How to set up if WeChat does not allow adding by mobile phone number
Mar 12, 2024 pm 05:04 PM
How to set up WeChat to disallow adding via mobile phone number? In WeChat APP, you can disallow adding WeChat via mobile phone number, but most users don’t know how to set it up to not allow WeChat to be added via mobile phone number. Next is WeChat brought by the editor to users It is not allowed to add setting method tutorials through mobile phone numbers. Interested users can come and take a look! Tutorial on how to use WeChat. How to set up WeChat when adding a mobile phone number is not allowed. 1. First open the WeChat APP, enter the main page, click [Me] in the lower right corner to enter, and select the [Settings] function; 2. Then enter the setting function page and find [Friend Permissions] ] Service function; 3. Then on the friend permissions interface, slide the button behind [Verification is required when adding me as a friend]; 4. Finally, on the page shown below, slide [Mobile Phone Number]
How to change the mobile phone number of Xiaohongshu account? Will there be any impact if I change my mobile phone number?
Mar 22, 2024 am 08:11 AM
In the digital age, Xiaohongshu has become a platform for many people to share their lives and discover good things. Over time, we may need to change the mobile phone number on the account. So, how to change Xiaohongshu’s mobile phone number? 1. How to change the mobile phone number of Xiaohongshu account? 1. Log in to your Xiaohongshu account and enter the “My” page. 2. Click "..." in the upper right corner and select "Settings". 3. On the settings page, find the "Account and Security" option and click to enter. 4. On the Account and Security page, find the "Mobile Phone Number" option and click to enter. 5. At this time, the page will display the current mobile phone number, click "Change Mobile Number". 6. Enter the new mobile phone number, receive the verification code, and fill it out. 7. Set a new password to ensure account security. 8. After completing the above steps,
How to register two B-site numbers with one mobile phone number? How does Station B unbind its mobile phone?
Mar 21, 2024 pm 10:10 PM
Bilibili (Bilibili), as a video sharing website very popular among Chinese young people, has attracted a large number of users. Some users hope to have two Bilibili accounts so that they can be managed and used separately. So, how to register two B-site numbers with one mobile phone number? This article will focus on this issue and how to unbind the mobile phone. 1. How to register two B-site numbers with one mobile phone number? 1. Register a new account: First, open the Bilibili App on your mobile phone or log in to the official website, click the "Register" button, and select the registration method. You can use your mobile phone number, email or third-party account (such as WeChat, QQ, etc.) to register. 2. When registering an account, please fill in the necessary information according to the system prompts, including mobile phone number, verification code, and set password. Be sure to use different accounts
The difference between full-width spaces and half-width spaces
Mar 25, 2024 pm 12:45 PM
The difference between full-width spaces and half-width spaces. When we use word processing software or edit text content, we sometimes encounter the concept of spaces. Space is a very basic element in typesetting and formatting text, but many people may not know the difference between full-width spaces and half-width spaces. In daily use, we may feel that full-width spaces and half-width spaces have different effects in different situations, but we may not be aware of the subtle differences. First of all, the difference between full-width spaces and half-width spaces is the width they occupy.
How to use PUT request method in jQuery?
Feb 28, 2024 pm 03:12 PM
How to use PUT request method in jQuery? In jQuery, the method of sending a PUT request is similar to sending other types of requests, but you need to pay attention to some details and parameter settings. PUT requests are typically used to update resources, such as updating data in a database or updating files on the server. The following is a specific code example using the PUT request method in jQuery. First, make sure you include the jQuery library file, then you can send a PUT request via: $.ajax({u
jQuery Tips: Quickly modify the text of all a tags on the page
Feb 28, 2024 pm 09:06 PM
Title: jQuery Tips: Quickly modify the text of all a tags on the page In web development, we often need to modify and operate elements on the page. When using jQuery, sometimes you need to modify the text content of all a tags in the page at once, which can save time and energy. The following will introduce how to use jQuery to quickly modify the text of all a tags on the page, and give specific code examples. First, we need to introduce the jQuery library file and ensure that the following code is introduced into the page: <
How to use spaces correctly in Go
Mar 29, 2024 pm 03:42 PM
Go language is a simple, efficient, and highly concurrency programming language. It is an open source language developed by Google. In the Go language, the use of spaces is very important, it can improve the readability and maintainability of the code. This article will introduce how to use spaces correctly in Go language and provide specific code examples. Why you need to use spaces correctly In the programming process, the use of spaces is very important for the readability and beauty of the code. Appropriate use of spaces can make code clearer and easier to read, thus reducing
