Я пытаюсь создать динамическое поле ввода электронной почты, которое использует автозаполнение в поле ввода текста и помещает выбранные получатели в промежуток, предшествующий полю ввода. Эти два контейнера помещены в div. Div имитирует поле ввода, в то время как span и поле ввода не видны.
Я хочу, чтобы это выглядело гладко, как в большинстве почтовых программ. Создание блока div просто содержит выбранные получатели и убедитесь, что пустое поле ввода не занимает место.
Однако в настоящий момент проблема заключается в том, что поле ввода требует пробела и обычно занимает последнюю строку div. Как этого избежать?
Вот контейнеры:
<div class="message-userfield" ><span id="fake_to"></span><input type="text" name="auto" id="auto" /></div>
Я пытался использовать jquery, чтобы уменьшить ширину поля ввода, когда данные не вводятся, однако поле ввода не «подпрыгивает» рядом с диапазоном. Как я могу это сделать.
$("#auto").focus(function(){
$(this).css({width:'200px'});
});
$("#auto").blur(function(){
$(this).css({width:'10px'});
});
Как бы вы сделали это поле ввода гладким и динамичным? Помощь будет оценена!