0

I've got the jQuery autofill script working to populate my text box as the user types to recomend results.

$( "#tags" ).autocomplete({
source: availableTags,
open: function(event, ui) {
        $(".ui-autocomplete").css({
            'width' :   '600px'
        });
     }
});
});

What I need it to do is stop searching inside of the options and just search from the first letter.

For instance if an option is "Blue" and the user types "Bl" then "Blue" should populate like it does, but I don't want the user to type in "ue" and have "Blue" appear as an option.

EDIT: based on the post below I'm trying this script but it doesn't seem to work:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>jQuery UI Real Autocomplete</title>

<!-- jQuery UI  |  http://jquery.com/  http://jqueryui.com/  http://jqueryui.com/docs/Theming  -->
<style type="text/css">body{font:62.5% Verdana,Arial,sans-serif}</style>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
<script>
var availableTags = [
  "ActionScript",
  "AppleScript",
  "Asp",
  "BASIC",
  "C",
  "C++",
  "Clojure",
  "COBOL",
  "ColdFusion",
  "Erlang",
  "Fortran",
  "Groovy",
  "Haskell",
  "Java",
  "JavaScript",
  "Lisp",
  "Perl",
  "PHP",
  "Python",
  "Ruby",
  "Scala",
  "Scheme"
];
$( "#tags" ).autocomplete({
  source: function( request, response ) {
    var matches = $.map( availableTags, function(tag) {
      if ( tag.toUpperCase().indexOf(request.term.toUpperCase()) === 0 ) {
        return tag;
      }
    });
    response(matches);
  }
});

</script>
</head>
<body>

  <label for="tags">Tags: </label>
  <input id="tags">

</body>
</html>
4

1 回答 1

2

在 Jquery 的论坛上查看此链接: https ://forum.jquery.com/topic/select-only-items-that-start-with-jquery-ui-autocomplete

该链接中的一张海报以此为例:http: //jsbin.com/avoyu5/1/edit

如果您输入“sc”,您将看到它完全按照您的要求工作(它不会显示“javascript”,但会显示“scala”)

于 2013-04-27T18:53:44.427 回答