创建自动完成功能，不显示每个单词答案

【问题标题】：Creating an autocomplete function, not showing every word创建自动完成功能，不显示每个单词
【发布时间】：2013-08-03 05:08:08
【问题描述】：

我正在尝试创建一个模拟自动完成，因为 jQuery 提供的那个是重载的，我不想用那么多。

var easyBB = {
  spellCheck: function(boolean,options) {
if(boolean === true){
  $('textarea').on('keyup',function() {
    var wordTyped = $(this).val();
  for(var word in options.words){
    var i=0;
     while(wordTyped.indexOf(options.words[word])) {
     $('#responsiveWords').html(options.words[word]);
       i++;
      }
     }
    });

   }
  }
 };

   easyBB.spellCheck(true,{
       words:[
         "ActionScript",
         "AppleScript",
         "Asp",
         "BASIC",
         "C",
         "C++",
         "Clojure",
         "COBOL",
         "ColdFusion",
         "Erlang",
         "Fortran",
         "Groovy",
         "Haskell",
         "Java",
         "JavaScript",
         "Lisp",
         "Perl",
         "PHP",
         "Python",
         "Ruby",
         "Scala",
         "Scheme"
         ]                 
      });

基本上这将用于文本区域，第一个问题是如何让他们当前输入的单词为此工作。

下一个问题是只显示单词数组中的第一个单词。甚至不类似于它在字符方面最接近的单词。而且它只会显示一个词，我希望它显示任何具有 indexOf 值的词...

有人可以帮助我并向我解释我在这里做什么。我是一个自学成才的人，所以学习意味着实际应用于代码，这就是我编写 while 循环的原因。今天刚学会 .call :) 抱歉无关紧要，无论如何我在这里做错了什么有什么建议吗？

http://jsbin.com/edolap/1/edit

【问题讨论】：

试试jsbin.com/efuwic/27
效果更好，有没有办法显示所有以字符开头的单词？我记得我在代码中写错了 .html() 而不是 .append() 所以我会检查一下
jsbin.com/efuwic/33/edit
@NigelThorne 我很接近 ;) jsbin.com/efuwic/30/edit 这是我的尝试，它在大多数情况下都有效，只是它不断重复。谢谢！

标签： javascript object for-loop while-loop do-loops

【解决方案1】：

试试这个

var easyBB = {

  spellCheck: function(b,xxx) {
      $('textarea').on('keyup',function() {
        var list = xxx.words;
        var wordTyped = $(this).val();
        $('#responsiveWords').html(""); // reset the list
        if(wordTyped === "") return; // check we have something otherwise you get all results here.
        for (var i = 0; i < list.length; i++) {
          if(list[i].indexOf(wordTyped) === 0){
            $('#responsiveWords').append($("<li>"+list[i]+"</li>")); // create and append items
          }
        }
     });
  }
};


easyBB.spellCheck(true,
                  { words:[
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ]});

【讨论】：