创建自动完成功能,不显示每个单词

时间:2013-08-02 03:23:46

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

我正在尝试创建一个模拟自动完成,因为jQuery提供的一个是重载的,我不想那么多使用它。无论如何,这对于我自己的学习目的来说更多,因为我从来没有使用过do循环或while循环,所以请光临我。

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"
         ]                 
      });

基本上这将是针对textarea的,第一个问题是如何获得他们当前正在键入的单词以便为此工作。

下一个问题是只显示单词数组中的第一个单词。甚至不像它在字符方面最接近的那个词。它也只会显示一个单词,我希望它能显示任何索引为值的单词......

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

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

1 个答案:

答案 0 :(得分: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"
    ]});