René 's Weblog
...und was die Welt schon immer nicht wissen wollte
Texthighlight mit jQuery
Zugriffe:2650Bewertung:4(3Bewertungen)19.04.2009 - René Drescher-Hackel

Johann Burkhard hat ein interessantes jQuery-Plugin entwickelt und unter der MIT-License veröffentlicht, mit dem es möglich ist, bestimmte Textpassagen farblich hervorzuheben. Anwendungsgebiete gibt es hierzu reichlich, ich denke dabei nur an die Suchfunktion auf einer Webseite. Häufig werden mehrere Fundstellen zur formulierten Suchanfrage ausgeben, doch verliert man den Überblick und bei mancher Fundstelle fragt man sich, "was hatte das mit meiner Anfrage zu tun gehabt". In solchen Fällen ist es hilfreich für den Suchenden, wenn seine Anfrage in der Fundstelle farblich hervorgehoben wird.

Die Implementierung ist dabei - wie fast immer bei jQuery-Plugins - denkbar einfach:

Man fügt zunächst die Javascriptdatei seinem Projekt und resp. seiner Webseite hinzu. Dann erfolgt die Auswahl des Containers innerhalb dessen die Textmarkierung erfolgen soll. Auf diese Auswahl ruft man die Methode  highlight auf und über gibt den zu markierenden Text als Argument.

Ich habe dieses Plugin in diesem Blog implementiert. Wer also die praktische Seite sich ansehen möchte, benutze hier einfach die Suche.

Einzig im Plugin habe ich eine kleine Ergänzung vornehmen müssen, nämlich wenn ein Leerstring als Argument übergeben wird. Für diesen Fall muss die Methode verlassen werden. So habe ich im Plugin folgende Zeile hinzugefügt:

jQuery.fn.highlight = function(pat) {
    if (pat == "") { return this; }
...

Und zu guter Letzt: es funktioniert in allen Browsern, die jQuery unterstützen.

Kick it on dotnet-kicks.de
sehr gutungenügend

Ihr Kommentar zu diesem Beitrag:
your gravatar
Sollten die Eingabefelder deaktiviert sein, so aktualisieren Sie den Bestätigungscode.
Bestätigungscode
Das Weblog von René Drescher-Hackel beschäftigt sich überwiegend mit Themen aus dem Bereich der Webanwendungsentwicklung mit den Themenschwerpunkten ASP.NET und C# im DOT-NET Framework 2.0 / 3.5. In der clientseitigen Entwicklung liegt der Schwerpunkt bei Javascript und jQuery. René; Drescher-Hackel hat die Prüfung zum Microsoft Certified Tecnology Specialist - .NET Framework 2.0 Web Applications abgelegt.