Bei Texteingabe in input-Feld div einblenden

[EKKi]

Mahlzeit Philipp.,

Okay, ich werde das zukünftig mal berücksichtigen.

Du hast es noch nicht wirklich verstanden:

<input type="text" id="eingabe" onkeyup="showtext(this, 'textl')"><br>

Hier wird beim Loslassen einer Taste die Funktion "showtext()" aufgerufen. Diese bekommt zwei Parameter übergeben: einmal das Eingabeelement selbst und dann noch der String 'textl'.

function showtext(txt, textl)
      {

So sieht die entsprechende Funktionsdeklaration aus - der erste Parameter (das Eingabeelement als Objekt) wird in der Variablen "txt" gespeichert, während die Variable "textl" (wieso auch immer Du sie so genannt hast - ich fand meine Benennung "div_id" wesentlich sinnvoller) den String 'textl' enthält.

if (txt.value == "")
          {

Hier wird die Variable "txt" in der Funktion genutzt, um den Wert des Eingabeelements zu überprüfen.

Hingegen nutzt Du die Variable "textl" in der gesamten Funktion nicht. Wieso nicht? Dann brauchst Du ihren Wert auch nicht als Parameter zu übergeben.

Ich hatte sie an dieser Stelle

var div = document.getElementById('textl');

genutzt, um auf ein bestimmtes <div> zuzugreifen - so dass beim Funktionsaufruf bestimmt werden kann, welches <div> sich die Funktion greifen soll. Du hast diese Flexibilität allerdings wieder komplett zunichte gemacht, indem Du hier auf immer das selbe statische <div> zugreifst, da Du der Methode "getElementById()" immer den gleichen String als Parameter übergibst ... anstatt hier den zweiten Parameter der Funktion zu nutzen.

Weißt Du überhaupt, was Du tust? Oder probierst Du solange herum, bis zufällig ungefähr das passiert, was Du willst?

Damit ist zumindest die statische "Google Suggest"-Variante fertig :)

Nein, noch lange nicht:

lis = document.getElementsByTagName('li').length;

1. solltest Du globale Variablen vermeiden, wenn es nicht unbedingt zwingend notwendig ist, sie zu verwenden: informiere Dich über das Schlüsselwort "http://de.selfhtml.org/javascript/sprache/variablen.htm#definieren@title=var",

2. hast Du in dieser Auflistung ALLE <li>-Elemente - auch wenn in Deinem Dokument etwas mehrere <ul> oder <ol> enthalten sind ... ich bezweifle, dass das sinnvoll ist und dass es das ist, was Du willst.

function insert(lex)
      {
        document.getElementById('eingabe').value = lex;
        document.getElementById('textl').style.visibility = "hidden";
      }

Hier wieder ein sehr schönes Beispiel einer IMHO sinnfreien Funktion. Einerseits ist der Funktionsname viel zu unklar (Was genau macht die Funktion eigentlich? Bist Du Dir sicher, dass Du das auch noch in einem halben Jahr weißt, OHNE den Code genau zu studieren?), andererseits ist sie nur für diese eine Kombination von Eingabeelement und <div> zu gebrauchen, da sie immer fest auf diese beiden zugreift - dabei könntest Du sehr einfach beim Funktionsaufruf bestimmen, welche Elemente manipuliert werden sollen:

function insert_eingabe(wert, txt_id, div_id) {  
  var txt = document.getElementById(txt_id);  
  var div = document.getElementById(div_id);  
  
  if (txt && div) {  
    txt.value = lex;  
    div.style.visibility = 'hidden';  
  }  
}

<li><a lex="Anderer Text 3" href="#" onclick="insert_eingabe(lex, 'eingabe', 'textl');">Text3</a></li>

Übrigens: was steht in der Variablen "txt"? Woher kommt der Wert?

MfG,
EKKi