Автоматическое заполнение Ajax (или автопредлагают) с заполнением клавишей Tab / автозаполняется подобный для окружения завершения командной строки?

Я предположу, что при высказывании "веб-сервисов" Вы имеете в виду SOAP и WS -* набор стандартов. (Иначе я мог утверждать, что сервисы REST "веб-сервисы".)

канонический аргумент - то, что сервисы REST являются более близким соответствием к дизайну сети - то есть, дизайну HTTP и связанной инфраструктуры. Таким образом использование сервиса REST будет более совместимо с существующими веб-инструментами и методами.

, Конечно, как только Вы развертываете в специфические особенности, Вы узнаете, что оба подхода имеют преимущества в различных сценариях. Это - те специфические особенности, которыми Вы интересуетесь?

8
задан tshepang 4 June 2014 в 23:47
поделиться

3 ответа

Этот конкретный тип автозаполнения не поддерживается в популярных плагинах автозаполнения (для jQuery, Scripty ...), потому что обычно они предоставляют раскрывающийся пользовательский интерфейс для выбора желаемого соответствия.

Итак, давайте предположим, что у нас нет готового решения. Бу-хо. Насколько сложно это кодировать?

// takes a text field and an array of strings for autocompletion
function autocomplete(input, data) {
  if (input.value.length == input.selectionStart && input.value.length == input.selectionEnd) {
    var candidates = []
    // filter data to find only strings that start with existing value
    for (var i=0; i < data.length; i++) {
      if (data[i].indexOf(input.value) == 0 && data[i].length > input.value.length)
        candidates.push(data[i])
    }

    if (candidates.length > 0) {
      // some candidates for autocompletion are found
      if (candidates.length == 1) input.value = candidates[0]
      else input.value = longestInCommon(candidates, input.value.length)
      return true
    }
  }
  return false
}

// finds the longest common substring in the given data set.
// takes an array of strings and a starting index
function longestInCommon(candidates, index) {
  var i, ch, memo
  do {
    memo = null
    for (i=0; i < candidates.length; i++) {
      ch = candidates[i].charAt(index)
      if (!ch) break
      if (!memo) memo = ch
      else if (ch != memo) break
    }
  } while (i == candidates.length && ++index)

  return candidates[0].slice(0, index)
}

Тестовая страница здесь - она ​​должна работать в обычных браузерах. Для поддержки IE используйте прослушивание событий из prototype.js, jQuery или других.

20
ответ дан 5 December 2019 в 06:53
поделиться

Если вы используете jQuery, отличный плагин - http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ . Просто используйте css, чтобы скрыть раскрывающийся список, и оставьте функцию автозаполнения табуляции включенной.

Я думаю, что было бы просто создать плагин jquery для себя ...

Вдоль строк Слушайте клавишу Tab Когда нажата клавиша табуляции, запускается вкладка: нажмите на input.autotab

   $(document).keydown(function(e){ if (e.keyCode = (tab-key?)){
       $('input.autotab').trigger('tab:press');
   });      

Свяжите вкладку input.autotab: нажмите событие (в каждом цикле ... если focus == true и т. Д.) Либо с поиском в массиве javascript, либо запрос xhr (ajax), затем установите это входное значение в качестве возвращаемых данных.

  $('input.autotab').bind('tab:press', function(){
      if (this.hasFocus){
         this.disabled = true;
         $.get('/autotab', { q: $(this).val() }, function(response){
               $(this).val(response);
               this.disabled = false;
         }, function(){ this.disabled = false; });
      }
  });

В сценарии автозаполнения запишите его так, чтобы значение совпадало более одного раза в базе данных (используйте цикл for с индексом, остановив в элементе индекса, где соответствует первый элемент), и вернуть значение до этой точки.

3
ответ дан 5 December 2019 в 06:53
поделиться

The simplest way would be to just use the jQuery and the autocomplete plugin. Looking the the stackoverflow html, it seems that they are using the same stuff. Seems to work very well for most browsers. The plugin also has an extensive demo that should help you figure out how to implement it to your specific needs.

Here's a quick sample from the plugin home page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/demo/main.css" type="text/css" />
  <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.css" type="text/css" />
  <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.bgiframe.min.js"></script>
  <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js"></script>
  <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script>
  <script>
  $(document).ready(function(){
    var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax Utilities".split(" ");
    $("#example").autocomplete(data);
  });
  </script>

</head>
<body>
  API Reference: <input id="example" /> (try "C" or "E")
</body>
</html>

More to be found here http://docs.jquery.com/Plugins/Autocomplete

1
ответ дан 5 December 2019 в 06:53
поделиться
Другие вопросы по тегам:

Похожие вопросы: