Wie kann ich den Link erweitern

[overhead]

Hallo Leute,

ich möchte einen Link umbauen, dazu habe ich einen Eingabefeld was den Wert gibt was hinzugefügt werden soll.
Aber natürlich soll nach dem Eingabewert noch etwas angehängt werden was immer gleich ist.
Ich habe hier mal einen Code vielleicht kann mri jemand helfen.

<input type="text" name="lfd" id="ctrl_239" class="text" value="">
<script>
    function setlfdValueToHref(element) {
        var lfdValue = document.querySelector('[name=lfd]').value;
        if (element.href.search('id-' + lfdValue) < 0) {
            element.href += lfdValue;
        }
    }
</script>
<a href="http://domain.de/details/id-" onmouseover="setlfdValueToHref(this)" target="_blank" class="searchicon">LFD Search</a>

Link soll nach eingabe in das Inpoutfeld wie folgt aussehen:
http://www.domain.de/details/id-[inputwert]?act=edit

"?act=edit" soll noch hinten ran und der "[inputwert]" ist der Wert der durch das Inputfeld eingetragen wird.

 

[mikdoe]

ich würde den link mit dom methoden bauen wie z.b. .createElement()
welche konkrete frage hast du denn?

 

[overhead]

Bitte mal den letzten Absatz anschauen dort steht drin wie der Link am Ende aussehen soll.
Also aktuell bekomm ich ja bei dem Script oben das geschriebene in dem Inputfeld an den Link ran aber ich brauch noch das "?act=edit" hinten ran dann wäre ich glücklich.

Bin übrigens Newbie des wegen komm ich ja mit dem Code zu euch.

 

[mikdoe]

ok dann sag ich auch einfach mal: bitte mal meinen ersten satz lesen

 

[overhead]

Okay dann werde ich mal nach der dom Methode schauen. Aber ich dachte halt bei meinem Code fehlt nur was damit das ?act=edit einfach mit dem Link angefügt wird.

Finde Irgendwie kein richtiges Beispiel.
Weil die Erstellen zwar Überschriften aber ich will ja in dem Inputfeld eine Zahl eingeben und dann wenn ich Searchicon drücke das er mir einen Link gleich aufmacht mit dem was ich in dem Inputfeld geschrieben + ?act=edit und nicht erst generiert.

- - - Aktualisiert - - -

SO...

Ein blindes Huhn findet auch mal ein Korn.
Ich hab die Lösung ganz einfach gefunden.
Mein Code war nicht ganz so schlecht es haben ein + und zwei " gefehlt.

<input type="text" name="lfd" id="ctrl_239" class="text" value="">
<script>
    function setlfdValueToHref(element) {
        var lfdValue = document.querySelector('[name=lfd]').value;
        if (element.href.search('id-' + lfdValue) < 0) {
            element.href += lfdValue [COLOR="#FF0000"]+ ".html?act=edit"[/COLOR];
        }
    }
</script>
<a href="http://domain.de/details/id-" onmouseover="setlfdValueToHref(this)" target="_blank" class="searchicon">LFD Search</a>

p.s. Der Code ist von einem Kumpel und eigentlich nicht schwer zu verstehen, aber als Newbie ab und an mal eine Hürde.
Ich hoffe das vielleicht dieser Code anderen Leuten hilft, die z.B. einen Teil des Link variable gestalten wollen und danach einen wieder einen festen Teil einbauen wollen.

 

[mikdoe]

das heißt, der unvollständige link ist die ganze zeit zu sehen auch bevor man die zahl eingegeben hat?
und wenn man die zahl eingegeben hat muss man extra den link noch anklicken?
ich war nicht davon ausgegangen, dass gute user experience keine rolle spielt.

danke, dass du die lösung gezeigt hast.

 

[overhead]

Naja es sollte ja eine Art Suchformular werden und da ist halt dauerhaft ein Inputfeld und ein Absendelink/Button zu sehen. Aber ich glaube ich weiß was du meinst. Und zwar führt der unvollständige Link ins nirvana. mhh muss ich mal schauen ob ich das noch irgendwie raus bekomme.

Aber danke erstmal.

 

[mikdoe]

wie gesagt, ich würde nach eingabe der id entweder sofort mit location umleiten oder mit .createElement() den link dynamisch in das dom erzeugen (evtl. mit fading) was auch eine gute js übung ist

 

[kkapsner]

Ich würde die Funktion setlfdValueToHref ja im oninput des <input> aufrufen und darin könntest du den Link über display: none; bzw. inital; ein- und ausblenden (also wenn nichts drin steht ausblenden - auch beim Laden der Seite).

Auch ist es keine gute Idee, da dauernd etwas an das .href anzuhängen. Wenn man mehrmals über den Link drüberfährt, wird der Inhalt ja immer länger.