Проверка на ввод
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Year Input Validation</title>
<style>
input, select {
background-color: hsl(215,100%,90%);
color: hsl(215,100%,40%);
border: 1px solid hsl(215,100%,40%);
outline: none;
}
</style>
</head>
<body>
<div id="inp">
<input type="text" size="4" id="desiredYear" />
<select id="desiredEra">
<option>до н.э.</option>
<option selected>н.э.</option>
</select>
</div>
<script type="text/javascript">
var input = document.getElementById('desiredYear');
var select = document.getElementById('desiredEra');
var inputTimeout;
input.addEventListener('input', (e) => {
clearTimeout(inputTimeout);
changeInputType('number');
inputTimeout = setTimeout(() => {
processInput(e.target.value);
}, 800);
});
input.addEventListener('focusout', () => {
changeInputType('text');
});
function changeInputType(type) {
input.type = type;
}
function processInput(value) {
// Удаление пробелов
value = value.trim();
// Ограничение на ввод символов
if (!/^[\\d\\+\\-]*$/.test(value)) {
input.value = '';
return;
}
// Удаление лишних символов
if (value.match(/[\\+\\-]{2,}/)) {
input.value = value.replace(/[\\+\\-]{2,}/g, '');
return;
}
// Проверка на длину
if (/^\\d+$/.test(value) && value.length > 6) {
input.value = value.slice(0, 6);
return;
} else if (/^[\\+\\-]?\\d+$/.test(value) && value.length > 7) {
input.value = value.slice(0, 7);
return;
}
// Удаление знаков в начале
if (/^[\\+\\-]/.test(value)) {
value = value.slice(1);
}
// Удаление ведущих нулей
value = value.replace(/^0+/, '');
// Если всё равно пусто, установить "1"
if (value === '' || value === '0') {
input.value = '1';
select.selectedIndex = 0; // "до н.э."
} else {
input.value = value;
}
// Логика для выбора века
if (parseInt(input.value) < 0) {
select.selectedIndex = 0; // "до н.э."
input.value = Math.abs(parseInt(input.value)).toString();
} else {
select.selectedIndex = 1; // "н.э."
input.value = parseInt(input.value).toString();
}
}
</script>
</body>
</html>
|
помогите исправить скрипт, все введенные данные удаляются, как сделать чтобы удалялись только ведущие нули и знак - или +, и в зависимости от того отрицательное или положительное число, переключался селектед в выпадающем списке
|
надо запретить ввод символов кроме знаков - + и цифр, надо запретить ввод более шестизначного числа, с знаком или без, надо запретить ввод знаков между цифрами, и после цифр, знак может быть только перед цифрами, в поле не может быть более одного знака - или +, при вводе 0, 000, 000000, без знака или со знаком - или +, скрипт должен исправить значение на 1 г. до н.э., когда пользователь начинает вводить в инпут, тип поля должен изменится с type="text" на type="number"
спустя 0.7сек после того как пользователь прекратил ввод данных, скрипт должен обрезать знак и ведущие нули, если они есть, и переключить селектед между опциями в случае необходимости, вернуть первоначальное значение type="text" возможно ли это сделать на js ? |
| Часовой пояс GMT +3, время: 18:51. |