Katerina23

Как сделать заполнения букв в input вместо черточек

Recommended Posts

Как сделать, чтобы строка при заполнении такой строки  "_____", где 5 чёрточек вместо чёрточек заполнялись буквы и если я захочу стереть какие-нибудь буквы, то чёрточки восстанавливались, а буквы при этом не должны смещаться с позиции влево, например, на пятой позиции вместо чёрточки буква "а", то при удалении буквы находящейся на 2 позиции буква, "а" не смещалось влево на другие позиции. Я слышала, что такое можно сделать как-то с помощью масок, но даже не представляю как?

Share this post


Link to post
Share on other sites

Вы уверены, что вам input нужен? 
Сомнительно, что в inpute возможно сделать, чтобы буквы не смещались. 

Вы кроссворд делаете что ли?)

Share this post


Link to post
Share on other sites

Да, не понятно что вам нужно сделать.

А так чтобы все символы были одинакового размера, нужно использовать моноширинный шрифт.

Share this post


Link to post
Share on other sites

В общем, мне нужно было в моём приложении перехватить backspace, чтобы повесить на него событие клавиатуры. В итоге я просто создала поле (input) и фокус указала на это поле. Теперь при нажатии backspace браузер не делает шаг назад в истории. 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Member Statistics

    46,330
    Total Members
    3,128
    Most Online
    god
    Newest Member
    god
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.



  • Спрашивают сейчас

  • Пишут сейчас

    • Здравствуйте. Попробуйте вот так
    • <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css"> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="header"> <div class="product"> <h1>Product Name</h1> <ul class="sps"> <li>Put on this page information about your product</li> <li>A detailed description of your product</li> <li>Tell us about the advantages and merits</li> <li>Associate the page with the payment system </li> </ul> </div> <div class="banner"> </div> </div> </div> </body> </html> body{ margin: 0; font-family: Arial; font-style: normal; } .container{ margin: 0; width: 90%; margin: 0 auto; } .header{ min-height: 223px; background-color: #445162; color: white; padding: 50px 50px; } .product{ width: 47%; display: inline-block; } .product > h1{ font-size: 60px; margin: 0; } .product:after{ content: ""; display: block; clear: both; } .banner{ background-color: white; width: 35%; min-height: 243px;; display: inline-block; float: right; } .sps > li{ font-size: 20px; line-height: 36px; list-style-image: url(images/check_icon.png) } почему div banner наезжает на надпись и как это исправить? И скажите в общем, что я делаю не так, как по правильному это сверстать?
    • Здравствуйте, Всем!
      Что-то не ищется.. Хочу найти шаблон для Landing page с минимальными наворотами.
      Скачивал всякие Free шаблоны, весят они под 2MB со всякой трепухой внутри, которая может подтягивать из вне что-то ещё и по цепочке. Туда может быть встроено всё что угодно: майнинг, редирект, сбор статистики и т. д. Проверять все эти минифицированные тонны кода нет желания.. Я люблю когда ясный чистый код, без всякой хиромантии..
      Такой шаблон и редактировать проще.. Быстрее работает, меньше глюков.. Ну что может быть нужно для Лендинга из библиотек реально? Разве что jQuery и пара плагинов к нему для ненавязчивой анимании (хотя, опять-таки луче уже если анимация будет на CSS, хотя, могу тут ошибаться в плане совместимости со старыми браузерами).
      Конечно адаптивность важна, но это не требует огромного Bootstrap, а достаточно нескольких media query. Может кто посоветует где посмотреть подобные шаблоны..  
  • Popular Contributors