Skip to content

Instantly share code, notes, and snippets.

@aleduca
Created January 12, 2023 13:30
Show Gist options
  • Save aleduca/cf51b88e0f85b4eea703413d18598c14 to your computer and use it in GitHub Desktop.
Save aleduca/cf51b88e0f85b4eea703413d18598c14 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div x-data="data()">
<input x-mask:dynamic="changeInput" placeholder="Phone" id="phone">
</div>
<script defer src="https://unpkg.com/@alpinejs/[email protected]/dist/cdn.min.js"></script>
<script defer src="https://unpkg.com/[email protected]/dist/cdn.min.js"></script>
<script>
function data(){
return {
phone:'',
changeInput(input){
if(input.length <= 14){
this.phone ='(99) 9999-9999';
}else{
this.phone = '(99) 99999-9999';
}
return this.phone;
}
}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment