The HTML+JS structure is as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title>jquery i18n plugin</title>
<style>
div{
width:400px;
margin:100px Auto;
}
input{
width:300px;
height:32px;
margin-top:10px;
padding:0px 10px;
Box-sizing:border-box;
}
</style>
<script type= "Text/javascript" src= "Js/jquery.js" ></script>
<body>
<div>
<input type= "text" placeholder= "Please enter the Chinese numeral letter underline" data-type= "name"/>
<input type= "text" placeholder= "Please enter the digital letter underline" data-type= "Mix"/>
<input type= "text" placeholder= "Please enter phone number" data-type= "Telephone"/>
<input type= "text" placeholder= "Please enter email" data-type= "email"/>
</div>
<script type= "Text/javascript" >
$ (document). Ready (function () {
var html = ';//used to store the value after input checksum
Get Focus Event
$ (' body '). On (' Focus ', ' input ', function () {
HTML = $ (this). Val ();
})
Input Box Modify Event
$ (' body '). On (' input ', ' input ', function () {
var text = ' ',
InputType = $ (this). Data ("type");
if (inputtype== "name") {
Regfun ($ (this), $ (this). Val (),/^ (?! _) [a-za-z_0-9\u4e00-\u9fa5]+$/g, "Please enter the Chinese alphanumeric underline, cannot begin with an underscore")
}else if (inputtype== "mix") {
Regfun ($ (this), $ (this). Val (),/^ (?! _) [a-za-z_0-9]+$/g, "Please enter a numeric letter underline, cannot begin with an underscore")
}
});
This method is called when you press the keyboard to directly modify the value of input
function Regfun (Obj,text,regexp,warn) {
if (regexp.test (text)) {
Text.replace (Regexp,function (res) {
HTML = res;//If the regular match succeeds in assigning the matching result to the HTML
});
}else{
if (text!= ') {
Alert (Warn)
}else{
html = ';
}
if (Obj.data ("type") = = = "Name") {
Obj.val (HTML);
}
}
return HTML;
if (Obj.data ("type")! = "Name") {
Obj.val (HTML);
}
}
For some users, such as the mailbox phone number, after the user input completely can be verified with the lost focus of the event
$ (' body '). On (' Blur ', ' input ', function () {
var InputType = $ (this). Data ("type");
if (inputtype== "telephone") {
Blurfun ($ (this),/^1[34578]\d{9}$/, "phone number input is wrong!" ")
}else if (inputtype== "email") {
Blurfun ($ (this),/^ ([a-za-z0-9_\.\-]) +\@ (([a-za-z0-9\-]) +\.) + ([a-za-z0-9]{2,4}) +$/, "Incorrect email input! ")
}
});
Method of losing focus event checksum
function Blurfun (Obj,regexp,warn) {
var text = Obj.val ();
if (!regexp.test (text) &&text!= ") {
Console.log (warn);
Obj.focus ();
}
}
});
</script>
</body>
Replace implements regular filtering to replace illegal characters
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
