WB: Unbekannte Variablen

Hallo alle zusammen,

ich bin blutiger Anfänger was JS angeht und bitte um eure Hilfe.

Ein Formular soll durch zwei Buttons abzufragen sein und dabei jeweils entweder google oder youtube abfragen

mit chrome als browser funktioniert das, aber bei IE kommt immer "variable nicht definiert" die varibale ist die id des formulars und heißt "rush"

ich poste hier meinen quellcode bitte guckt euch den mal an

vielen dank!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Unbenanntes Dokument</title>

<script language="JavaScript">

function youtube()
{
rush.name="search_query"
formular.action="http://youtube.com/results?search_type=&aq=f";
formular.submit();
}

function google()
{
rush.name="q"
formular.action="http://www.google.de/search?hl=de&amp;q=&amp;meta";
formular.submit();
}

</script>

<style type="text/css">
<!--
.style1 { text-align: center;
}
-->
  </style>
</head>

<body style="color: black; background-color: white;"
 onload="document.forms[0].rush.focus();" alink="red" link="blue"
 vlink="purple">

<form name="formular" action=""  method="get" target="_blank">
  <p align="left">
    <input id="rush" name="" type="text"   size="50" maxlength="255">
  </p>
  <p align="left">
    <input type="button" value="Google" onclick="google()"  />
    <input type="button" value="Youtube" onclick="youtube()" />
</form>
</body>
</html>

  1. Hi,

    mit chrome als browser funktioniert das, aber bei IE kommt immer "variable nicht definiert" die varibale ist die id des formulars und heißt "rush"

    Du gehst fälschlicher Weise davon aus, dass allein aus der Existenz eines Elementes mit einer ID auch ein gleichnamiges Element im globalen Gültigkeitsbereich von JavaScript bereitgestellt würde. (Den Fehler macht übrigens normalerweise der IE, andere Browser nicht.)

    Besorge dir also zunächst eine Referenz auf das HTML-Element, bspw. mittels document.getElementById, und spreche es dann darüber an.

    MfG ChrisB

    --
    Light travels faster than sound - that's why most people appear bright until you hear them speak.
  2. @@WB:

    nuqneH

    rush.name="search_query"
    formular.action="http://youtube.com/results?search_type=&aq=f";

    'formular' ist kein Unterobjekt des 'window'-Objektes, sondern des 'document'-Objektes. Du kannst es also per 'document.formular' ansprechen (<http://de.selfhtml.org/javascript/objekte/forms.htm@title=Schema 2 für Formulare>).

    'rush' ist dann ein Unterobjekt dieses Formularobjektes. Du kannst es also per 'document.formular.rush' ansprechen (<http://de.selfhtml.org/javascript/objekte/elements.htm@title=Schema 2 für Formular-Elemente>).

    onload="document.forms[0].rush.focus();"

    Hier hattest du es richtig (<http://de.selfhtml.org/javascript/objekte/forms.htm@title=Schema 1 für Formulare>).

    Du solltest dich aber für eine Variante entscheiden.

    Naja, ganz so richtig aber auch doch nicht, weil du auf die Art ein Formularelement mit @name="rush" ansprechen würdest, nicht mit @id="rush".

    In einigen Browsern funktioniert es auch mit @id, verlassen sollte man sich aber nicht darauf, dass es dies in allen Browsern tut.

    Du kannst dem 'input'-Element aber erstmal @name="rush" geben:
    <input id="rush" name="rush" type="text" size="50" maxlength="255"/>

    Eine andere Möglichkeit hat [ChrisB] schon genannt.

    Qapla'

    --
    Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
    1. Hallo und vielen Dank erst einmal

      ich habe mein problem leider noch nicht lösen können

      Du kannst dem 'input'-Element aber erstmal @name="rush" geben:
      <input id="rush" name="rush" type="text" size="50" maxlength="255"/>

      das problem ist ja genau, dass ich dem input element keinen festen namen geben kann, da das name tag für die verschiedenen abfragen jeweils unterschiedlich sein muss.

      Wie kann ich es schaffen, dass dem input feld sozusagen bei den verschiedenen verwendungen immer ein anderer name vergeben wird?

      WB

      1. @@WB:

        nuqneH

        das problem ist ja genau, dass ich dem input element keinen festen namen geben kann, da das name tag für die verschiedenen abfragen jeweils unterschiedlich sein muss.

        Du kannst dem Ding doch initial @name="rush" geben und nachdem du dir anhand des Namens eine Referenz zu dem Objekt geholt hast (speichern), dann @name ändern:

        var rush = document.formular.rush;  
        rush.name = "q"; // bzw. "search_query"
        

        Ich hab aber nicht getestet, ob da alle Browser mitspielen.

        Qapla'

        --
        Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
        1. so hats funktioniert!!! Vielen Dank!

          function google()
          {
          var rush = document.formular.rush;
          formular.rush.name="q"
          document.formular.action="http://www.google.de/search?hl=de&;q=&;meta";
          document.formular.submit();
          }

          1. Neues Problem:

            wenn ich nun das ganze im IE ausprobiere funktionierts alles prima beim ersten durchgang, will ich dann eine weitere abfrage starten, dann bekomme ich die fehlermeldung: "formular.rush ist null oder kein objekt"

            was ist falsch, wie schaffe ich es dass das "unendlich" funktioniert?

            hier ist nochmal der quellcode:

            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" xmlns = "http://www.w3.org/1999/xhtml" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

            <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <title>Unbenanntes Dokument</title>

            <script type="text/javascript">

            function wikipedia()
            {
            var rush = document.formular.rush;
            formular.rush.name = "search";
            document.formular.action="http://de.wikipedia.org/wiki/";
            document.formular.submit();
            }

            function youtube()
            {
            var rush = document.formular.rush;
            formular.rush.name = "search_query";
            document.formular.action="http://youtube.com/results?search_type=&;aq=f";
            document.formular.submit();
            }

            function google()
            {
            var rush = document.formular.rush;
            formular.rush.name="q"
            document.formular.action="http://www.google.de/search?hl=de&;q=&;meta";
            document.formular.submit();
            }

            </script>
            </head>

            <body>

            <form name="formular" action=""  method="get" target="_blank">
                <input name="rush" type="text" size="50" maxlength="255">

            <input type="button" value="Google" onclick="google()"/>  
            

            <input type="button" value="Wikipedia" onclick="wikipedia()"/>
            <input type="button" value="Youtube" onclick="youtube()"/>

            </form>

            </body>
            </html>

            1. Hallo,

              wenn ich nun das ganze im IE ausprobiere funktionierts alles prima beim ersten durchgang, will ich dann eine weitere abfrage starten, dann bekomme ich die fehlermeldung: "formular.rush ist null oder kein objekt"

              natürlich, du änderst ja auch den Namen des Objekts. Kein Wunder, dass du dann über den vorherigen Namen nicht mehr darauf zugreifen kannst.

              was ist falsch, wie schaffe ich es dass das "unendlich" funktioniert?

              Speichere die Referenz, die du beim ersten Mal erhalten hast, anstatt sie jedesmal neu zu ermitteln.

              So long,
               Martin

              --
              Lieber Blödeleien als blöde Laien.
  3. @@WB:

    nuqneH

    Von deinem JavaScript-Problem abgesehen noch einige Hinweise:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head>

    Du hast das Start-Tag des 'html'-Elements vergessen: <html xmlns="http://www.w3.org/1999/xhtml"> Das hätte dir der Validator auch gesagt.

    Das wäre auch die Stelle, die <http://de.selfhtml.org/html/xhtml/unterschiede.htm#lang@title=Textsprache anzugeben>.

    <script language="JavaScript">

    Du hast das 'type'-Attribut vergessen. Das hätte dir der Validator auch gesagt.

    Das völlig unnütze 'language'-Attribut kannst du in die Ablage Rund entsorgen.

    formular.action="http://youtube.com/results?search_type=&aq=f";

    formular.action="http://www.google.de/search?hl=de&amp;q=&amp;meta";

    ▲▲▲▲▲  ▲▲▲▲▲
    Du siehst den Unterschied?

    Der Kontext ist hier JavaScript, darin haben Zeichenreferenzen nichts zu suchen. '&' ist richtig, '&amp;' ist falsch.

    Die Zeichenreferenzen werden nämlich nicht aufgelöst, wenn der JavaScript-Bereich als CDATA verarbeitet wird, was bei Auslieferung von XHTML als 'text/html' der Fall ist.

    Bei Auslieferung mit einem XML-Medientypen ('application/xhtml+xml') allerdings sieht das http://de.selfhtml.org/html/xhtml/unterschiede.htm#script_style@title=anders aus, weshalb solche JavaScript-Bereiche in XHTML als CDATA gekennzeichnet werden sollten:

    <script type="text/javascript">  
    [code lang=javascript]//[code lang=xml]<![CDATA[
    

    //]]>[/code]
    </script>[/code]

    Noch besser wäre freilich, das JavaScript in eine externe Datei zu verlagern.

    <style type="text/css">
    <!--

    -->

    Die völlig unnütze HTML-Auskommentierung von CSS-Code kannst du in die Ablage Rund entsorgen.

    .style1 { text-align: center;

    "style1" ist ein sehr schlecht gewählter Bezeichner. Was soll sich dahinter verbergen?

    <body style="color: black; background-color: white;"
    onload="document.forms[0].rush.focus();" alink="red" link="blue"
    vlink="purple">

    Inline-Styles sind böse[tm], sowohl 'style'-Attribute als auch missbilligte HTML-Attribute.

    Die Angaben kommen auch ins zentrale Stylesheet ('style'-Element im 'head'):

    body  
    {  
      color: black;  
      background-color: white;  
    }  
      
    a:link  
    {  
      color: blue;  
    }  
      
    a:visited  
    {  
      color: purple;  
    }  
      
    a:active  
    {  
      color: red;  
    }
    

    Noch besser wäre freilich, das Stylesheet in eine externe Datei zu verlagern.

    Im Markup steht dann nur noch: <body onload="document.forms[0].rush.focus();">

    Noch besser wäre freilich, die Registrierung des Eventhandlers ins JavaScript zu verlagern, aber das ist eine andere Geschichte.

    <input id="rush" name="" type="text"   size="50" maxlength="255">

    Das Element ist <http://de.selfhtml.org/html/xhtml/unterschiede.htm#leere_elemente@title=nicht geschlossen>. Das hätte dir der Validator auch gesagt.

    Qapla'

    --
    Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)