jQuery - Saisie semi-automatique du widget

La description

le Widget AutoComplete La fonction peut être utilisée avec des widgets dans JqueryUI. Les widgets de saisie semi-automatique fournissent des suggestions pendant que vous tapez dans le champ. Pour supposer que vous donnez Ja en entrée, il fournira une sortie en Java ou JavaScript.

Syntaxe

Voici la syntaxe simple pour utiliser la saisie semi-automatique -

$( "#tags" ).autocomplete({
   source: availableTags
});

Exemple

Voici un exemple simple montrant l'utilisation de la saisie semi-automatique -

<!doctype html>
<html lang = "en">
   <head>
      <meta charset = "utf-8">
      <title>jQuery UI Autocomplete - Default functionality</title>
		
      <link rel = "stylesheet" 
         href = "//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
			
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
		
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js">
      </script>
  
      <script>
         $(function() {
            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: availableTags
            });
				
         });
      </script>
   </head>

   <body>
      <div class = "ui-widget">
         <label for = "tags">Tags: </label>
         <input id = "tags">
      </div>
 
   </body>
</html>

Cela produira le résultat suivant -

jquery-widgets.htm