Я хочу, чтобы все, что я пишу в текстовом поле, было заглавными буквами. Как я пишу, не потеряв фокус.
Как это сделать с помощью jQuery?
Как сделать все в текстовом поле заглавными/прописными буквами?
Ответы (5)
Я бы использовал CSS для этого.
Просто добавьте text-transform: uppercase к своему стилю, а затем на стороне сервера вы сможете преобразовать его в верхний регистр.
input {
text-transform: uppercase;
}
person
Brandon
schedule
04.10.2010
Вы можете добавить класс или этот стиль программно с помощью jQuery, если хотите, но это, вероятно, то, что вам нужно.
- person Stefan Kendall; 04.10.2010
+1, хорошо, я тоже думал о всевозможных решениях jquery/js, но это лучше
- person Michel; 05.10.2010
отлично, у меня было фоновое изображение для полей ввода, которые я хотел заглавными, и это ИДЕАЛЬНО! СПАСИБО!
- person randomizertech; 05.10.2010
По какой-то причине это не работает в IE6: / есть идеи, почему??
- person randomizertech; 06.10.2010
@fgualda, боюсь, я не знаю, извини. Он должен работать. В соответствии с совместимостью CSS (msdn.microsoft.com/ en-us/library/cc351024%28VS.85%29.aspx), он должен работать. Я бы посоветовал спросить на doctype.com. Они, скорее всего, смогут помочь с проблемами стиля.
- person Brandon; 06.10.2010
Моя единственная проблема заключается в том, что текст заполнителя также отображается в верхнем регистре.
- person Dustin Graham; 16.01.2014
Useoninput='this.value=this.value.toUpperCase();
Это событие как раз для таких случаев, срабатывает после ввода пользователем (нажатия клавиши), но перед обновлением (отображением значения), поэтому с этим набранным текстом не будет мерцать при конвертации, и значение также правильное (не похоже на использование только стиля для изменения отображения без изменения реальных данных).
person
Cpt Balu
schedule
16.01.2014
Возможно, вам придется использовать их комбинацию.
использование стиля text-transform отображает тип только в верхнем регистре, хотя значение вполне может быть в нижнем регистре.
JavaScript изменит текущий текст на верхний только после изменения поля или потери фокуса
вы можете использовать jquery gazler или просто встроенный javascript
например onblur='javascript:this.value=this.value.toUpperCase();'
Это означает, что текстовое значение будет отображаться в верхнем регистре и фактически будет отображаться в верхнем регистре, когда значение изменяется/элемент управления теряет фокус.
HTH Сэм
person
sambomartin
schedule
04.10.2010
Единственная проблема с onblur заключается в том, что если пользователь просто нажимает клавишу ввода, скажем, для отправки формы, текст не будет отображаться в верхнем регистре.
- person Joseph; 23.10.2013
Чтобы основываться на ответе @Gazler, улучшенное решение, которое лучше обрабатывает ключи-модификаторы (при условии, что у вас есть заполнитель смешанного регистра и вы не можете установить text-transform: uppercase; ):
$('.search-input input[type=text]').keyup(function() {
var v = $(this).val();
var u = v.toUpperCase();
if( v != u ) $(this).val( u );
})
person
sean2078
schedule
26.02.2017
person
schedule
Действительный момент, его следует объединить с решением Брэндона, чтобы правильно изменить его на стороне клиента. Немного изменен код для обновления при нажатии клавиши.
- person Gazler; 05.10.2010
Я удалил свой отрицательный голос, потому что теперь он делает то, что просит ОП. Но если бы я был пользователем веб-сайта, на котором была изменена эта клавиша, я бы выследил виновного. Видеть, как буквы меняются по мере того, как вы печатаете, дезориентирует, а попытка вернуться назад, чтобы отредактировать то, что вы набрали, разочаровывает, потому что курсор продолжает двигаться до конца. jsfiddle.net/HPapz/1
- person Greg; 05.10.2010
Вы правы, поэтому мой комментарий выше, я проголосовал за решение CSS.
- person Gazler; 05.10.2010
