Biblioteca de JavaScript para el filtrado rápido de páginas completas-Holmes. js
| Autor: | Haroenv |
|---|---|
| Views Total: | 2,057 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 19, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Holmes. js es una biblioteca de JavaScript ligera que permite al usuario rápidamente y simplemente filtrar/buscar a través de cualquier contenido dentro de su página web.
Funcionamiento
Cree una búsqueda archivada para filtrar contenido dentro de la Página Web.
<input type="search" placeholder="search here" required>
Descargue e inserte la biblioteca Holmes. js en la Página Web.
<script src="js/holmes.js"></script>
Inicialice el Holmes y especifique el contenido de destino que desea buscar.
holmes({
input: 'input',
find: '.element'
}); Agregue los siguientes fragmentos de código CSS a la sección de de estilo .
.hidden {
display: none;
} Todos los parámetros predeterminados.
holmes({
// A querySelector to find the input
input: 'input[type=search]',
// A querySelectorAll rule to find each of the find terms
find: null,
// Text to show when there are no results (innerHTML)
placeholder: false,
// to start showing the result in a mark tag inside the .find, you should enable this
mark: false,
class: {
// class to add to matched items
visible: false,
// class to add to non-matched items
hidden: 'hidden'
},
// query the value of the .find at every input
dynamic: false,
// minimum amount of characters need to be typed before Holmes starts filtering
minCharacters: 0,
// adds hidden="true" to hidden elements
hiddenAttr: !1,
// A custom matching function to be called with as first argument the text of an element, and as second argument the current input text. This should return true if you want the element to show, and false if it needs to be hidden.
shouldShow: function(){}
}); Funciones de devolución de llamada disponibles.
holmes({
onHidden: function(el){},
onVisible: function(el){},
onEmpty: function(placeholder){},
onFound: function(placeholder){},
onInput: function(input){},
}); API methods.
var h = new holmes(options); // clear h.clear() // what elements are visible, hidden and in total at any point h.count() // Start an even listener for the specified options. Holmes always has .start() running on initialisation. h.start() // Stops the current running event listener. Resolves a Promise when this has been completed. h.stop()
Registro de cambios
v1.17.3 (08/19/2018)
- actualizar
