#javascript #html #css #validation #input
Вопрос:
Вот простое поле ввода
<input type="password">
Во время ввода данных каждый символ отображается в маркерах (# символов = # маркеров).
// "password" = ********
Как я могу отобразить только ОДИН маркер, несмотря на ввод большего количества символов? С помощью чистого JS или/и CSS.
// "password" = *
Комментарии:
1. Зачем ты это сделал? Как пользователь узнает, что он не вводил пароль жирными пальцами или что их нажатия клавиш даже регистрируются?
2. Я настоятельно призываю вас не делать этого. если «клиент» или ваш «босс» подталкивает вас к этому, отодвиньтесь, если возможно (укажите им на эти комментарии, например). Это плохая идея создавать ужасный пользовательский интерфейс. Это также сложно реализовать, и это, скорее всего, приведет к ошибкам, как в доступности, так и в других видах ошибок.
Ответ №1:
Вы можете просто добавить отступ в конце элемента ввода, чтобы скрыть все, кроме одного * :
input {
width: 50px;
padding-right: 40px;
box-sizing: border-box;
} <input type="password" value="Correct horse battery staple" /> Почему ты это сделал, выше моего понимания, но это работает.
На самом деле, запуск этого сразу же показывает мне первую проблему с этой идеей: кнопка моего менеджера паролей в поле ввода достаточно велика, чтобы полностью покрыть этот первый символ.