script.aculo.us Autocompletar. Opción de búsqueda parcial local

La biblioteca script.aculo.us es una biblioteca multinavegador que tiene como objetivo mejorar la interfaz de usuario de un sitio web. El Autocompletador se puede utilizar para proporcionar soporte de autocompletado para campos de texto en la página web.

Autocompletar.Búsqueda parcial local 

Sintaxis:

{ partialSearch: boolean }

Valores:

  • booleano: este es un valor booleano que especifica si el texto coincidirá solo al comienzo de las strings. El valor predeterminado es falso.

Ejemplo 1: en este ejemplo, hemos establecido la opción de búsqueda parcial en falso, por lo que buscará solo desde el comienzo de la string.

HTML

<!DOCTYPE html>
<html>
  
<head>
    <!-- Include the required scripts -->
    <script type="text/javascript" 
        src="prototype.js">
    </script>
  
    <script type="text/javascript" 
src="scriptaculous.js?load = effects,controls">
    </script>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
  
    <label for="GeeksforGeeks">
        Input any name:
    </label>
      
    <br />
    <input id="GeeksforGeeks" autocomplete="off"
        size="40" type="text" value="" />
  
    <div class="autocomplete" id="names"
        style="display:none">
    </div>
  
    <script type="text/javascript">
  
        // Array to be used as choices
        var names = [
            'Ab gfg',
            'Abc gfg',
            'Abcd gfg',
            'Abcde gfg',
            'Abcdef gfg',
            'Abcdefg gfg',
            'Abcdefgh gfg'
        ];
  
        // Initialize the Autocompleter
        new Autocompleter.Local('GeeksforGeeks',
            'names', names, {
  
            // Specify whether only the 
            // beginning of the strings
            // would be searched
            partialSearch: false
        });
    </script>
</body>
  
</html>

Producción:

Ejemplo 2: en este ejemplo, hemos establecido la opción de búsqueda parcial en verdadero, por lo que buscará desde cualquier lugar de la string.

HTML

<!DOCTYPE html>
<html>
  
<head>
    <!-- Include the required scripts -->
    <script type="text/javascript" 
        src="prototype.js">
    </script>
  
    <script type="text/javascript" 
src="scriptaculous.js?load = effects,controls">
    </script>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
  
    <label for="GeeksforGeeks">
        Input any name:
    </label>
      
    <br />
    <input id="GeeksforGeeks" autocomplete="off"
        size="40" type="text" value="" />
  
    <div class="autocomplete" id="names"
        style="display:none">
    </div>
  
    <script type="text/javascript">
  
        // Array to be used as choices
        var names = [
            'Ab gfg',
            'Abc gfg',
            'Abcd gfg',
            'Abcde gfg',
            'Abcdef gfg',
            'Abcdefg gfg',
            'Abcdefgh gfg'
        ];
  
        // Initialize the Autocompleter
        new Autocompleter.Local('GeeksforGeeks',
            'names', names, {
  
            // Specify whether only the beginning
            // of the strings would be searched
            partialSearch: true
        });
    </script>
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por taran910 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *