Ve nuestra revisión de 10 de los mejores complementos de autocompletado para sus formularios escritos en javascript y jQuery

Top 10: los mejores plugins de autocompletado de jQuery y javascript

A una persona normal no le gusta escribir el nombre completo de algo que todo el mundo conoce, eso es aburrido. Ahí es donde entran en juego los mágicos y útiles autocompletar, que le permiten completar automáticamente una entrada completa mientras escribe solo las iniciales de la palabra larga.

Son una parte importante de la experiencia del usuario, y sus formularios deben incluir uno si la entrada debe tener valores largos que el usuario necesita memorizar. Disfrute de nuestra colección de 10 de los mejores complementos de jQuery de autocompletado para sus proyectos.

10. Flexselect

Github | Demo

FlexSelect es un complemento de jQuery que convierte cuadros de selección en controles de búsqueda incremental de coincidencia flexible. La combinación flexible de algunas pulsaciones de teclas con cadenas más largas es una bendición en la productividad para los mecanógrafos. Aplicaciones como Quicksilver, LaunchBar y Launchy han hecho que este método de entrada de teclado sea muy popular. Es hora de llevar esta misma funcionalidad a los controles web. FlexSelect hace eso para las cajas de selección.

Demostración de FlexSelect

9. Autocomplete.js

Github | Demo

Autocomplete.js es un complemento de jQuery que mejora su búsqueda con sugerencias. Este complemento no admite llamadas remotas ajax, pero es útil para el autocompletado básico con un par de opciones.

Autocomplete.js

8. jQuery Autocompletar PixaBay

Github | Demo

Este complemento se basa en gran medida en el maravilloso Ajax Autocomplete de DevBridge. Es un código de complemento ultraligero que está perfectamente optimizado para sus necesidades. Compatible con jQuery 1.7.0+ en Firefox, Safari, Chrome, Opera, Internet Explorer 7+. Sin dependencias excepto la biblioteca jQuery.

  • Ligero: 3,4 kB de JavaScript - menos de 1,4 kB en gzip.
  • Fuente de datos totalmente flexible.
  • Caché inteligente, retardo y configuración mínima de caracteres.
  • Devolución de llamada.

Autocompletar jQuery

7. autocompletar xdsoft

Github | Demo

El complemento JQuery Autocomplete es un complemento liviano, simple y fácil en la configuración de autocompletar como Google, es compatible con Accent Folding.

Autocompletar XDSOFT

6. Autocompletador de jQuery

Github | Demo

jQuery Autocompleter es un complemento jQuery simple, fácil, personalizable y con soporte de caché. Se inicializa directamente en un elemento de entrada.

Demostración del autocompletador de jQuery

5. MagicSuggest

Github | Demo

MagicSuggest es un cuadro combinado de componentes de autocompletar fácil de usar creado para temas de arranque.

Demostración de MagicSuggest

4. Fácil autocompletar

Github | Demo

EasyAutocomplete es un complemento de autocompletado de jquery altamente configurable:

  • Admite conjuntos de datos locales y remotos (JSON, XML y texto sin formato).
  • Utiliza llamadas al método ajax .
  • Permite buscar, ordenar y relacionar la frase de respuesta.
  • Le permite usar un par de plantillas de lista diferentes e incluso le ofrece la posibilidad de crear su propia plantilla de lista .
  • Como uno de los mejores complementos de autocompletar de jquery , EasyAutocomplete admite identificadores de devolución de llamada, por lo que se puede configurar para ejecutar funciones en eventos específicos .
  • Tiene un par de versiones interesantes, limpias y modernas en estilos CSS (sin requisitos de imágenes).

EasyAutocomplete gif

3. Caballo

Github | Demo

Horsey es un componente de autocompletado progresivo y personalizable. 

Es una biblioteca de autocompletar rápida, fácil de usar y confiable.

El objetivo era producir un autocompletado independiente del marco que se integre fácilmente en su marco MVC favorito, que no se traduzca en una adición significativa a su base de código, y es agradable trabajar con él . Horsey comparte la filosofía de diseño modular de Rome, el selector de fecha y hora . Además, funciona bien con Insignia, el componente del editor de etiquetas y prácticamente cualquier otro componente bien delimitado que existe.

Autocompletar caballo

2. typeahead.js

Github | Demo

Inspirado en la función de búsqueda de autocompletar de twitter.com , typeahead.js es una biblioteca de JavaScript flexible que proporciona una base sólida para crear mecanografiados robustos.

La biblioteca typeahead.js consta de 2 componentes: el motor de sugerencias, Bloodhound , y la vista de la interfaz de usuario, Typeahead . El motor de sugerencias es responsable de calcular las sugerencias para una consulta determinada. La vista de IU es responsable de presentar sugerencias y manejar interacciones DOM. Ambos componentes se pueden usar por separado, pero cuando se usan juntos, pueden proporcionar una rica experiencia de escritura anticipada.

  • Muestra sugerencias a los usuarios finales mientras escriben.
  • Muestra la sugerencia principal como una pista (es decir, texto de fondo).
  • Admite plantillas personalizadas para permitir la flexibilidad de la interfaz de usuario.
  • Funciona bien con lenguajes RTL y editores de métodos de entrada.
  • Destaca las coincidencias de consulta dentro de la sugerencia.
  • Activa eventos personalizados para fomentar la extensibilidad.

Complemento de autocompletado de Twitter Typeahead

1. Autocompletar de jQuery

Github | Demo

Ajax Autocomplete para jQuery le permite crear fácilmente cuadros de autocompletar / autosugestión para campos de entrada de texto. No tiene más dependencias que jQuery.

Admite autocompletar desde fuentes locales y remotas. Ajax Autocomplete para jQuery se puede distribuir libremente bajo los términos de una licencia estilo MIT.

jQuery autocomplete devbridge

Si conoce otro increíble complemento de autocompletar de jQuery, ¡compártalo con la comunidad en el cuadro de comentarios a continuación!


Interesado en la programación desde los 14 años, Carlos es un programador autodidacta, fundador y autor de la mayoría de los artículos de Our Code World.

Conviertete en un programador más sociable

Patrocinadores