Html Javascript, Funktionsaufruf in Datei funktioniert nicht.

Gast #3657964
Lesenswert?
• ▲
▼
Ich habe eine Datei angelegt:
1
    function clear_searchValue(){
2
        document.getElementById("text_suchleiste").value = "";
3
    }
4
    function set_searchValue(){
5
        document.getElementById("text_suchleiste").value = "Suche...";
6
    }
7

8
    function set_klasse(var klassen_name, var objekt_id){
9
        alert("Klassenname = " );
10
        document.getElementById(objekt_id).className = klassen_name;
11
    }

und ich rufe diese Funktionen von einer FOrm aus auf:
1
<form>
2
                <input class="text_klasseNichtAngeklickt" id="text_suchleiste"
3
                onclick="
4
                            set_klasse('text_klasseAngeklickt', 'text_suchleiste');
5
                            clear_searchValue();"
6

7
                onblur="    set_klasse('text_klasseNichtAngeklickt', 'text_suchleiste');
8
                            set_searchValue(); "
9

10
                type="text" name="nm_suche" size="35" maxlength="35" value="Suche..."/>
11
            </form>

weiters sind:
1
#text_suchleiste{
2
    height: 25px;
3
}
4

5
#text_suchleiste:hover{
6
    box-shadow: 0px 0px 5px white;
7
}
8

9
.text_klasseNichtAngeklickt{
10
    color: #BFBFBF;
11
    box-shadow: 0px 0px 0px white;
12
    border: solid 1px;
13
    border-color: #ffffff;
14
}
15

16
.text_klasseAngeklickt{
17
    box-shadow: 0px 0px 5px white;
18
    color: #3F3C3C;
19
}

leider wird keiner dieser Javazeilen richtig ausgeführt. Ich habe das 
FIle natürlich richtig angehängt in das html Dokument mit:
1
<script language="javascript" type="text/javascript" src="javascript_suchleiste.js">

jedoch funktioniert es NUR wenn ich die Befehle von hand in das 
onClickEvent eingebe.

Hat wer eine Idee wieso die Funktionen im .js File nicht aufgerufen 
werden? Gestern hats noch funktioniert mit etwas abgeänderten 
Funktionen. Aber jetzt wo ich Parameter in den FUnktionen eingebaut hab 
geht gar nichts mehr.
#3657987
Lesenswert?
• ▲
▼
emi schrieb:
>
1
>     function set_klasse(var klassen_name, var objekt_id){
2
>         alert("Klassenname = " );
3
>         document.getElementById(objekt_id).className = klassen_name;
4
>     }
5
>

Die "var"s gehören weg bei Funktionsparametern. Das ist der erste 
Fehler, weiter habe ich den Code nicht überprüft.
Ev. man in die Debuggingtools  Konsole  ... schauen, der Browser hat 
sich wahrscheinlich eh darüber beschwert.

-->
1
function set_klasse(klassen_name, objekt_id){
2
    alert("Klassenname = " );
3
    document.getElementById(objekt_id).className = klassen_name;
4
}
Gast #3658319
Lesenswert?
• ▲
▼
Danke, funktioniert soweit!! Ach ja, ne Frage so nebenbei: Wenn meine 
Seite sehr sehr viele Seiten hat immer mit dem selben menü usw..
gibt es da einen ausweg, dass wenn ich eine einzige Seite vom Menü her 
ändere dass es bei allen anderen übernommen wird? Oder sollte ich lieber 
alles auf einer Seite zuerst machen und wenn ich mir dann hunder 
prozentig sicher bin das menü kopieren?
#3658339
Lesenswert?
• ▲
▼
emi schrieb:
> Danke, funktioniert soweit!! Ach ja, ne Frage so nebenbei: Wenn meine
> Seite sehr sehr viele Seiten hat immer mit dem selben menü usw..
> gibt es da einen ausweg, dass wenn ich eine einzige Seite vom Menü her
> ändere dass es bei allen anderen übernommen wird? Oder sollte ich lieber
> alles auf einer Seite zuerst machen und wenn ich mir dann hunder
> prozentig sicher bin das menü kopieren?

sowas löst man in zB PHP oder RubyonRails... das menü wird 1mal 
definiert.
was du hier machen willst ist wie das javascript oben Steinzeit ;)

schau dir doch mal ein CMS wie zB WordPress an ;) Für Javascript benutzt 
man übrigens heutzutage Frameworks wie jQuery, MooTools zusammen mit 
TypeScript oder CoffeeScript
#3658347
Lesenswert?
• ▲
▼
Hi emi

Das Problem mit dem content, der sich auf allen Seiten ändern soll 
könntest du folgendermassen lösen:

Entweder durch serverseitiges Scripting (Node.js, Php usw), welches dir 
deine HTML Seite aus einem Template zusammenbaut

Oder aber, du baust dir die View erst im Client zusammen, 
vorteilhafterweise mit Javascript.

Dies könnte dann zB folgendermassen aussehen:

Auf dem Server hast du ganz ein html File mit einer Art Grundstruktur, 
ganz einfach gesagt zum Beispiel:
1
<html>
2
<head>
3
<script src="deinJavascript.js"></script>
4
</head>
5
<body>
6
<div id="menu"></div>
7
<div id="inhalt"></div>
8
</body>
9
</html>


deinJavascript.js wartet dann mit einem eventhandler darauf bis die DOM 
geladen ist, und laedt danach das HTML des Menu und dasjenige der 
Einstiegsseite nach.
Zudem bräuchtest du in diesem Falle dann auf jedem Menüpunkt noch
einen ClickListener, welcher bei einem Klick das HTML fuer die 
entsprechende Seite abholt.

Das Menü und die einzelnen Seiten wuerden hierbei jeweils nur den Teil 
beinhalten, der im div mit id=menu oder div mit id=inhalt steht.

Zum Anfang lohnt es sich u.U. sowas fürs Verständnis noch in reinem 
Javascript zu schreiben, aber es gibt durchaus Libraries, welche einem 
viel Arbeit abnehmen können was dieses spezifische Problem angeht 
(www.jquery.com, www.angularjs.org)

Antwort schreiben

Eine eigene Frage? Dieser Thread ist über 12 Jahre alt. Stell sie in einem eigenen Thread – dort lesen mehr Leute mit, und sie wird öfter und schneller beantwortet.

Neuen Thread starten

Eine Lösung, Ergänzung oder Rückmeldung zu diesem Thread? Dann antworte hier.

Formatierung
  • [c]C-Code[/c]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] – Link zu einem Artikel
  • Verweis auf einen anderen Beitrag: Rechtsklick auf dessen Beitrags-ID (#8078628), „Adresse kopieren“, in den Text einfügen

Mehr zur Formatierung

Längeren Sourcecode als Anhang, nicht in den Text. JPG nur für Fotos und Scans; Zeichnungen und Screenshots als PNG oder GIF. Siehe Bildformate.

Schon registriert? Anmelden

Wird nicht angezeigt. Wir schicken dir einen Link; sobald du damit bestätigst, erscheint dein Beitrag.

Mit dem Abschicken legst du einen kostenlosen Account an und erkennst die Nutzungsbedingungen und die Datenschutzerklärung an.