Вопрос:
Я пытаюсь сделать первый символ в верхнем регистре ввода.
До сих пор я пробовал:
input:first-letter {text-transform:capitalize !important} input:first-letter {text-transform:uppercase !important}
Я также попытался создать поле ввода display:block; и display:inline-block;, но не повезло.
Я использую последнюю версию хром. Если я посмотрю в инспекторе
input:first-letter {text-transform:capitalize !important} is flagged to be active but it does not work.
Я открыт для любых решений JQuery, а также
Спасибо,
Лучший ответ:
:first-letter не будет работать в поле ввода. но он работает без этого.
Так измените его как input {text-transform:capitalize;}, он отлично работает. см. демонстрацию
он отлично работает без !important
input {text-transform:capitalize;}<input/>
Как вы упомянули в чистом css-способе, я добавил вышеописанный метод
Ограничение: Он будет использовать все слова в поле ввода. В чистом CSS на данный момент невозможно загладить только первое слово. вы должны попробовать jquery способ сделать это, как указано ниже
Использование jquery: –
с помощью события keyup
$(‘input’).keyup(function(){ if($(this).val().length>0){ var character = $(this).val().charAt(0); if(character!=character.toUpperCase()){ $(this).val($(this).val().charAt(0).toUpperCase()+$(this).val().substr(1)); } } });<script src=»https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js»></script> <input/>
Чтобы работать даже с событиями мыши: – (например, вырезать пасту в мыши)
Использование события changechange на $(‘input’).bind(‘input propertychange’, function() {
$(‘input’).bind(‘input propertychange’, function() { if($(this).val().length>0){ var character = $(this).val().charAt(0); if(character!=character.toUpperCase()){ $(this).val($(this).val().charAt(0).toUpperCase()+$(this).val().substr(1)); } } });<script src=»https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js»></script> <input/>Ответ №1
Вы можете использовать прослушиватель onKeypress и заглавные буквы первого символа значения. Помните, что эта функция будет запускаться каждый раз, когда нажата клавиша в input
$( «#keypress» ).keypress(function() { var val = $(this).val(); val = val.substr(0, 1).toUpperCase() + val.substr(1); $(this).val(val); });<script src=»https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js»></script> <input id=»keypress»>
