Как заблокировать первую часть value?
Всем привет. Очень нужна помощь.
Собственно, из названия темы все понятно, нужно ограничить возможность удаления value до определенного слова. Пример: <input type="text" class="email" value="Email: test@mail.ru" placeholder=""> Нужно сделать так, чтобы "Email: " удалить было нельзя. Желательно, чтобы валидация по нему не происходила. Это возможно? Вставить текст при помощи CSS и сделать padding не предлагать. "Email: " должен быть частью value. |
Максим Горский,
текст нельзя стереть
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
window.addEventListener('DOMContentLoaded', function() {
var email = document.querySelector('.email'),
str = 'Email: ';
email.addEventListener('input', function() {
this.value = str + this.value.slice(str.length);
});
});
</script>
</head>
<body>
<input type="text" class="email" value="Email: test@mail.ru" placeholder="">
</body>
</html>
|
рони, Спасибо Вам огромное, то что нужно, а если инпутов несколько? Как правильней написать? Или просто дублировать код?
|
Цитата:
|
Цитата:
Цитата:
|
рони,
Нет, разные, к примеру, если: <input type="text" class="email" value="Email: test@mail.ru" placeholder=""> <input type="text" class="first_name" value="Имя: Максим" placeholder=""> <input type="text" class="last_name" value="Фамилия: Горский" placeholder=""> <input type="text" class="sex" value="Пол: Мужской" placeholder=""> Хорошо ли будет просто дублировать код с другими значениями? Или можно написать как-то правильней? |
начало текста в input нельзя стереть
Максим Горский,
а зачем?
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
window.addEventListener('DOMContentLoaded', function() {
var inp = document.querySelectorAll('[placeholder]');
[].forEach.call(inp, function(item) {
var str = item.value.split(' ')[0]+' ';
item.addEventListener('input', function() {
this.value = str + this.value.slice(str.length);
});
});
});
</script>
</head>
<body>
<input type="text" class="email" value="Email: test@mail.ru" placeholder="">
<input type="text" class="first_name" value="Имя: Максим" placeholder="">
<input type="text" class="last_name" value="Фамилия: Горский" placeholder="">
<input type="text" class="sex" value="Пол: Мужской" placeholder="">
</body>
</html>
|
рони,
Большое спасибо, то, что нужно!) Что зачем? |
Максим Горский,
зачем сохранять? может в label записать? <label>Email: <input type="text" class="email" value="test@mail.ru" placeholder=""></label> |
рони, По макету нужно именно в инпуте вписать. Не хотел отрицательными мэрджинами текст вставлять.
|
| Часовой пояс GMT +3, время: 16:59. |