Schnellsuche wie "Strg + F" erstellen

[robwillkeks]

Hallo liebe Leute in diesem Forum ;)

ich würde gerne für meine Webseite eine Schnellsuche einbauen.
Die soll wie die "Strg + F" Funktion ausschauen.

Also wenn man in einem Textfeld "auto" eingibt, soll er alle Wörter von der Webseite die ein "auto" enthalten, auflisten.
Und mit "Weiter"- und "Zurück"-button von Wort zu Wort springen.

Ist das möglich und wenn ja, wie mach ich das? Ich hab gerade null Plan.

Danke im Voraus :)

Gruß
RobRob ;)

 

[mermshaus]

Was spricht denn gegen die vorhandene Suche der Clients?

Für deine Frage such mal im Web nach „javascript text highlighting“.

 

[robwillkeks]

So eine Schnellsuche nach Wörtern war ein Wunsch von meinem Chef und ich will es ausprobieren, ob das überhaupt möglich wäre, zu programmieren ;)

Ich schau mal ob ich es hinkriege, ist alles auf English könnt bisschen dauern :)

 

[Gilles]

Wenn du es wirklich umsetzen willst, dann musst du folgendermaßen vorgehen.
Alle Elemente aus dem Body auslesen und bei jedem Element das innerHtml nach dem Suchbegriff durchsuchen.
Dann müsstest du das innerHtml neu zusammen basteln, indem du vor und hinter jeden Suchbegriff einen Span oder ähnliches hinpackst. Diesen Span musst du dann mit Styles für die Farbunterlegung belegen.
Desweiteren solltest du dem Span eine eindeutige id geben. Sowas wie "jsSearchResult_1". Du solltest dir dann die Anzahl der Treffer abspeichern. Mit Hilfe dieser Informationen solltest du vorgehen können :)

 

[robwillkeks]

Oke, erstmal ein Danke an mermshaus & Gilles ;)

Ich hab es mit den englischen Seiten soweit geschafft, dass ich ein Wort eingebe, auf ein Button "Suche" klicke. Alle Wörter auf meiner Seite werden dann durch einer hellen Hintergrundfarbe hervorgehoben.

So. Jetzt habe ich noch das Problem wie ich von Wort zu Wort springen kann. Also mit einem "Weiter"- & "Zurück"-Button. Ich hab da Null Ahnung ;)

Um Antworten würde ich mich freuen

 

[Gilles]

Oke, erstmal ein Danke an mermshaus & Gilles ;)Ich hab es mit den englischen Seiten soweit geschafft, dass ich ein Wort eingebe, auf ein Button "Suche" klicke. Alle Wörter auf meiner Seite werden dann durch einer hellen Hintergrundfarbe hervorgehoben.So. Jetzt habe ich noch das Problem wie ich von Wort zu Wort springen kann. Also mit einem "Weiter"- & "Zurück"-Button. Ich hab da Null Ahnung ;)Um Antworten würde ich mich freuen

Wie hast du die Worte denn hervorgehoben? Wenns mit einem umrahmenden span oder einem anderen Element ist, müsstest du dem Element nur eine Id geben.Dann brauchst du einen Index, bei welchem Wort du dich grade befindest.Dann machst du sowas wie:location.href= location.href+"#wortsuche_"+indexDann würde er zu dem Wort springen. Hoffe du verstehst was ich mein

 

[robwillkeks]

Ahh. Ne vergiss das was ich geschrieben hab. Mein Chef meinte, dass was ich bisjetzt programmiert passt Nicht. Er möchte es genauso wie die "Strg + F" Funktion haben. Das wenn man in das Suchfeld eingibt gleich mit der Suche automatisch anfängt und alle Wörter gleich markiert.

Ich steh wieder am Anfang Mit 0 Ahnung. Und ich versteh nur Bahnhof hat jemand die Geduld und die Zeit mir das zu zeigen, erklären oder selbst auszuprobieren? :)

Gruß
RobRob ;)

 

[Gilles]

Ahh. Ne vergiss das was ich geschrieben hab. Mein Chef meinte, dass was ich bisjetzt programmiert passt Nicht. Er möchte es genauso wie die "Strg + F" Funktion haben. Das wenn man in das Suchfeld eingibt gleich mit der Suche automatisch anfängt und alle Wörter gleich markiert.

Ich steh wieder am Anfang Mit 0 Ahnung. Und ich versteh nur Bahnhof hat jemand die Geduld und die Zeit mir das zu zeigen, erklären oder selbst auszuprobieren? :)

Gruß
RobRob ;)

Gleiche vorgehensweise, nur dass du die Suche dann halt nicht nur beim absenden, sondern beim Ändern des Input-Feldes machst.

 

[robwillkeks]

Ähm Oke :)

Hast du etwas Geduld und große Nerven? Kannst du mir das bitte genauer erklären? Ein Beispielscript? Das ich es nachvollziehen kann?
Ich kenn mich mit JS garnicht aus. Steh voll auf n Schlauch

 

[mermshaus]

So eine Schnellsuche nach Wörtern war ein Wunsch von meinem Chef und ich will es ausprobieren, ob das überhaupt möglich wäre, zu programmieren ;)
[…]
Mein Chef meinte, dass was ich bisjetzt programmiert passt Nicht.
[…]
Ich steh wieder am Anfang Mit 0 Ahnung. Und ich versteh nur Bahnhof
[…]
Ich kenn mich mit JS garnicht aus. Steh voll auf n Schlauch

Mit anderen Worten: Du hast im Rahmen deines Jobs die Aufgabe, etwas zu erstellen, von dem du ohne fremde Hilfe nicht die geringste Ahnung hast, weshalb dir jemand anders die Arbeit machen soll.

Es ist zwar positiv, dass du das unumwunden zugibst und nicht einfach so tust, als wüsstest du, wovon du redest. (Das gibt es leider viel zu oft.) Aber so wirklich finde ich das nicht mit dem Sinn und Zweck des Forums zu vereinbaren. Eine gewisse Eigeninitiative und Bereitschaft, dich einzuarbeiten, sollte schon vorhanden sein.

Das wäre sonst eher ein Fall für die Jobbörse. Du hast hier bislang eben nur Arbeitsanweisungen verteilt. Inhaltlich kam gar nichts.

Du hast Ansätze, mit denen du arbeiten kannst. JavaScript-Hilfen sind im Internet auch verfügbar.

- https://developer.mozilla.org/en/JavaScript

 

[robwillkeks]

Das Stimmt. Ich hab eine Aufgabe bekommen, wo ich 0 Ahnung habe. Ich hab die Webseite alleine erstellt. Hab mich auch erst in HTML und CSS einarbeiten müssen. Das hat auch alles Gut geklappt. Aber JS ist halt eine Sprache für sich ;)

Und da ich soetwas nur einmal brauche, dachte ich, frage ich einfach nach.

Aber ich werd nicht ohne Einarbeitungen in JS weit kommen. Muss halt sein. Wird ein bisschen dauern :) aber was solls.

Danke ;)