I'm a junior developer and in charge of implementing some masks for inputs in customer web application. I already implement the function that made the mask, but the functions has a problem, I can't delete the characters added by the mask. Someone knows what's wrong?
The function are the same but just the regex changes.
The input
<input required type="tel" id="telefone" name="telefone" placeholder="(99) 99999-9999" class="input border-white placeholder-gray input-ghost focus:bg-white focus:text-accent" onfocus="sss()" pattern="[(][0-9]{2}[)] [0-9]{5}-[0-9]{4}" />
<input required type="text" placeholder="XX. XXX. XXX/0001-XX" name="cnpj" maxlength="18" id="cnpj" class="input border-white placeholder-gray input-ghost focus:bg-white focus:text-accent"/ onfocus="test()">
The masks
Phone mask
<script\>
document.getElementById('telefone').addEventListener('input', function (e) {
var x = e.target.value.replace(/\\D/g, '').match(/(\\d{0,2})(\\d{0,5})(\\d{0,4})/);
e.target.value = '(' +x\[1\] + ') '+ x\[2\] + '-' + x\[3\]
});
function sss()
{
console.log(document.getElementById('telefone').value)
}
\</script\>
Interprises IDs mask
<script>
document.getElementById('cnpj').addEventListener('input', function(e){
var x = e.target.value.replace(/\D/g, '').match(/(\d{0,2})(\d{0,3})(\d{0,3})(\d{0,4})(\d{0,2})/);
e.target.value = !x[2] ? x[1] : x[1] + '.' + x[2] + '.' + x[3] + '/' + x[4] + (x[5] ? '-' + x[5] : '');
})
</script>
I tried to add "?" on the regex sentence but didn't work
