Dodaj ključno besedo za iskanje po ključnih besedah v katerokoli spletno stran z Mark.js
Večina brskalnikov ima Funkcija CTRL + F za iskanje in iskanje, kar išče uporabnik. Toda ta funkcija na mobilnih napravah ni podprto in ne deluje dobro z dinamičnim besedilom.
Na srečo, tam je Mark.js, prost plugin JavaScript, ki dodaja a označite funkcijo iskanja na katero koli stran z lahkoto.
Privzeto deluje kot vanilla JS plugin lahko tudi teče na vrhu jQuery. Gre za popolnoma odprtokodni projekt, zato ga lahko uporabljate na katerem koli spletnem mestu, ki je komercialno ali drugače.
Deluje podobno kot katera koli funkcija iskanja v brskalniku, razen če ima dodatne ugodnosti. Dodate lahko lastne filtre po meri in poiščite besede, ki temeljijo na regularnih izrazov, posebne sinonime, in celo v dinamični elementi strani kot so okvirji.
Če želite začeti, prenesite datoteko Mark.js od GitHub ali gostite datoteko prek CDN da prihranite čas.
To funkcijo morate zagnati povezan z vnosnim poljem na strani. Tako lahko uporabniki vnesejo iskalne izraze in dobite takojšnje povratne informacije preko označenega besedila.
Tukaj je a odrezek vzorca z demo strani:
$ (". kontekst"). oznaka (ključna beseda [, možnosti]); The .kontekstu cilje razreda, kjer koli naj bi ta funkcija delovala iskanje pojmov. Lahko uporabite privzeti HTML element če skušate preiskati celotno stran, ali pa bi lahko prešli več elementov kot so različni pripomočki z karticami ali iframe.
Potem, znotraj oznaka () funkcijo prenesete ključno besedo, skupaj z možnostmi (če želite).
Če uporabnikom dovolite, da vnesejo ključno besedo, lahko to storite samodejno posodobi funkcijo z novo ključno besedo po vsakem pritisku na tipko. Obstaja tudi posebna funkcija za ciljanje tega dogodka.
Mark.js deluje z vsemi večjimi brskalniki, vključno s Chromom, Firefoxom, Operajem (v12 +) in Internet Explorerjem (9+). To je zelo enostavno nastaviti, če sledite dokumentom in uporabite najnovejše datoteke.
Ampak, če želite videti Mark.js v akciji pokukajte na spodaj z uporabo zelo osnovne demo jQuery za iskanje nekaj odstavkov Lorem Ipsum.
