I’m trying to create a regular expression mask to insert the time starting with seconds, minutes and finally the hour.
For example, showing 12:34:56 after typing – 6, 5, 4, 3, 2, 1
I tried creating a regular expression, but I’m not very experienced. If you can help me I would be very grateful
This is my regex that didn’t work:
<code>function timeinvert(v) {
v = v.replace(/D/g, "");
v = v.replace(/(d)(d)/, "$2$1")
v = v.replace(/(d)(d)(d)/, "$3:$2$1")
v = v.replace(/(d)(d)(d)(d)/, "$4$3:$2$1")
v = v.replace(/(d)(d)(d)(d)(d)/, "$5:$4$3:$2$1")
v = v.replace(/(d)(d)(d)(d)(d)(d)d+?$/, "$6$5:$4$3:$2$1")
// v = v.replace(/(d{2})(d)/, "$1:$2")
// v = v.replace(/(d{2})d+?$/, "$1")
return v;
}
</code>
<code>function timeinvert(v) {
v = v.replace(/D/g, "");
v = v.replace(/(d)(d)/, "$2$1")
v = v.replace(/(d)(d)(d)/, "$3:$2$1")
v = v.replace(/(d)(d)(d)(d)/, "$4$3:$2$1")
v = v.replace(/(d)(d)(d)(d)(d)/, "$5:$4$3:$2$1")
v = v.replace(/(d)(d)(d)(d)(d)(d)d+?$/, "$6$5:$4$3:$2$1")
// v = v.replace(/(d{2})(d)/, "$1:$2")
// v = v.replace(/(d{2})d+?$/, "$1")
return v;
}
</code>
function timeinvert(v) {
v = v.replace(/D/g, "");
v = v.replace(/(d)(d)/, "$2$1")
v = v.replace(/(d)(d)(d)/, "$3:$2$1")
v = v.replace(/(d)(d)(d)(d)/, "$4$3:$2$1")
v = v.replace(/(d)(d)(d)(d)(d)/, "$5:$4$3:$2$1")
v = v.replace(/(d)(d)(d)(d)(d)(d)d+?$/, "$6$5:$4$3:$2$1")
// v = v.replace(/(d{2})(d)/, "$1:$2")
// v = v.replace(/(d{2})d+?$/, "$1")
return v;
}
1
if you want to create a regular expression mask to insert the time starting with the hours, minutes and finally seconds you can use the following function.
<code>function timeForward(v) {
v = v.replace(/D/g, "");
if (v.length <= 2) {
return v;
} else if (v.length <= 4) {
v = v.replace(/(d{2})(d{2})$/, "$1:$2");
} else {
v = v.replace(/(d{2})(d{2})(d{2})$/, "$1:$2:$3");
}
return v;
}
</code>
<code>function timeForward(v) {
v = v.replace(/D/g, "");
if (v.length <= 2) {
return v;
} else if (v.length <= 4) {
v = v.replace(/(d{2})(d{2})$/, "$1:$2");
} else {
v = v.replace(/(d{2})(d{2})(d{2})$/, "$1:$2:$3");
}
return v;
}
</code>
function timeForward(v) {
v = v.replace(/D/g, "");
if (v.length <= 2) {
return v;
} else if (v.length <= 4) {
v = v.replace(/(d{2})(d{2})$/, "$1:$2");
} else {
v = v.replace(/(d{2})(d{2})(d{2})$/, "$1:$2:$3");
}
return v;
}
Start by inserting : after every other character. Then reverse it.
<code>function timeinvert(str) {
time_arr = [];
for (let i = 0; i < str.length; i++) {
if (i > 0 && i % 2 == 0) {
time_arr.push(':');
}
time_arr.push(str[i]);
}
time_arr = time_arr.reverse();
return time_arr.join('');
}
console.log(timeinvert('654321'));
console.log(timeinvert('54321'));
console.log(timeinvert('4321'));
console.log(timeinvert('321'));
console.log(timeinvert('21'));
console.log(timeinvert('1'));</code>
<code>function timeinvert(str) {
time_arr = [];
for (let i = 0; i < str.length; i++) {
if (i > 0 && i % 2 == 0) {
time_arr.push(':');
}
time_arr.push(str[i]);
}
time_arr = time_arr.reverse();
return time_arr.join('');
}
console.log(timeinvert('654321'));
console.log(timeinvert('54321'));
console.log(timeinvert('4321'));
console.log(timeinvert('321'));
console.log(timeinvert('21'));
console.log(timeinvert('1'));</code>
function timeinvert(str) {
time_arr = [];
for (let i = 0; i < str.length; i++) {
if (i > 0 && i % 2 == 0) {
time_arr.push(':');
}
time_arr.push(str[i]);
}
time_arr = time_arr.reverse();
return time_arr.join('');
}
console.log(timeinvert('654321'));
console.log(timeinvert('54321'));
console.log(timeinvert('4321'));
console.log(timeinvert('321'));
console.log(timeinvert('21'));
console.log(timeinvert('1'));0
What I understand is something like this;
<code>var str = "6,5,4,3,2,1";
var reg = /(d),(d),(d),(d),(d),(d)/;
console.log(str.replace(reg, "$6$5:$4$3:$2$1"));</code>
<code>var str = "6,5,4,3,2,1";
var reg = /(d),(d),(d),(d),(d),(d)/;
console.log(str.replace(reg, "$6$5:$4$3:$2$1"));</code>
var str = "6,5,4,3,2,1";
var reg = /(d),(d),(d),(d),(d),(d)/;
console.log(str.replace(reg, "$6$5:$4$3:$2$1"));0
Yet another way of doing it is by reversing the number on entry. Here’s a quick take on that. There’s easier ways of doing this, but this is what I came up with off the cuff.
In any case, there are definitely some edge cases to figure out here: what do you want to happen while the user is entering the data? For instance, after they’ve entered 6,5,4; should they see 4:56 or 45:6 or 45:60 or 40:56?
You’ll need to adjust the code to handle those and other cases as necessary.
<code>document.querySelectorAll('.reverso-time').forEach(el => el.addEventListener('keydown', (e) => {
switch (e.key) {
case '0':
case '1':
case '2':
case '3':
case '4':
case '5':
case '6':
case '7':
case '8':
case '9':
if (e.target.value.length) {
e.target.value = (e.key + e.target.value.replaceAll(/D/g, '').split('').reduceRight(
(agg, cur, idx) => (`${(idx % 2 === 0 ? `${cur}:${agg}` : `${cur}${agg}`)}`),
''
)).slice(0, 8).replace(/^:|:$/, '');
e.preventDefault();
}
break;
case ':':
e.preventDefault();
break;
case 'Backspace':
case 'Delete':
e.target.value = e.target.value.replace(/^:|:$/, '').replace(/(:d{1})$/, '$10');
break;
default:
console.log(e.key);
break;
}
}));</code>
<code>document.querySelectorAll('.reverso-time').forEach(el => el.addEventListener('keydown', (e) => {
switch (e.key) {
case '0':
case '1':
case '2':
case '3':
case '4':
case '5':
case '6':
case '7':
case '8':
case '9':
if (e.target.value.length) {
e.target.value = (e.key + e.target.value.replaceAll(/D/g, '').split('').reduceRight(
(agg, cur, idx) => (`${(idx % 2 === 0 ? `${cur}:${agg}` : `${cur}${agg}`)}`),
''
)).slice(0, 8).replace(/^:|:$/, '');
e.preventDefault();
}
break;
case ':':
e.preventDefault();
break;
case 'Backspace':
case 'Delete':
e.target.value = e.target.value.replace(/^:|:$/, '').replace(/(:d{1})$/, '$10');
break;
default:
console.log(e.key);
break;
}
}));</code>
document.querySelectorAll('.reverso-time').forEach(el => el.addEventListener('keydown', (e) => {
switch (e.key) {
case '0':
case '1':
case '2':
case '3':
case '4':
case '5':
case '6':
case '7':
case '8':
case '9':
if (e.target.value.length) {
e.target.value = (e.key + e.target.value.replaceAll(/D/g, '').split('').reduceRight(
(agg, cur, idx) => (`${(idx % 2 === 0 ? `${cur}:${agg}` : `${cur}${agg}`)}`),
''
)).slice(0, 8).replace(/^:|:$/, '');
e.preventDefault();
}
break;
case ':':
e.preventDefault();
break;
case 'Backspace':
case 'Delete':
e.target.value = e.target.value.replace(/^:|:$/, '').replace(/(:d{1})$/, '$10');
break;
default:
console.log(e.key);
break;
}
}));<code><label>Enter time in reverse: <input type="text" class="reverso-time"></label></code>
<code><label>Enter time in reverse: <input type="text" class="reverso-time"></label></code>
<label>Enter time in reverse: <input type="text" class="reverso-time"></label>0