Span как ввод с автозаполнением jquery ui

Question

На веб-странице, которую я строю, я начал использовать теги в качестве входных данных с включенным флагом редактирования содержимого. Причиной этого является то, что они выглядят более привлекательными для выравнивания и могут изменять свой размер, когда вы вводите их. И я сохраняю содержимое диапазона в скрытом поле ввода при keyup.

Я динамически добавляю больше промежутков, когда они необходимы.

Теперь мне нужно иметь возможность автозаполнения, когда люди вводят в мои поля диапазона, но .autocomplete, похоже, не работает с полями диапазона (?), Есть ли какое-то простое решение для этого?

<div>
  <input type="hidden" name="generated_name[1]" />
  <span contenteditable="true" class="editbox"></span>
  <input type="hidden" name="generated_name[2]" />
  <span contenteditable="true" class="editbox"></span>
</div>
<script>
  $(document).ready(function () {
    $('.editbox').live('keyup', function() {
      $(this).prev().val($(this).html());
    });
  });
</script>

Этот код хорошо работает для меня, по крайней мере, я могу добавить больше полей ввода (input + span), и он работает.

Теперь я хочу иметь возможность выполнять поиск при наборе пролетов вместо поля ввода и делать что-то вроде этого:

$(document).ready(function() {
  var tags = [
    "Tag1", "Tag2", "Tag3", "Tag4", "Tag5", "Tag6", "Tag7"
  ];
  $('.editbox').autocomplete({
    source: tags
  });
});

Кто-нибудь знает, возможно ли это простым способом?

Answer 1

Полагаю, что исправить это невозможно, поскольку автозаполнение зависит от использования на входах. Тогда, что эти двое </value> делают там? Они должны быть </span>. Злоупотреблять промежутком в качестве ввода для меня не имеет смысла. Ввод используется именно для той цели, для которой вы его используете, и вы также можете стилизовать ввод, это не очень хороший повод для замены их интервалами.