• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Anfängerfragen

Status
Für weitere Antworten geschlossen.
W

wolf360

Neues Mitglied
Was bringt es zwei Variablen mit += aneinander zu setzen?
als z.B.

Code: 
var test = "hi"
var du = "du"
document.write(test+=du);
oder das gleiche mit zahlen?

gruß wolf360
 
Du sparst dir schreibarbeit.

Anstatt
x = x + 3;
schreibst du dann
x+=3;

genauso wie
Anstatt
x = x+1;
kann man in vielen sprachen ja auch
x++;
schreiben.

Ebenso gibt es diese Ternären Bedingungskonstrukte, die ich persönlich behindert finde.
Dazu kannste hier: ?: - Wikipedia, the free encyclopedia was lesen.

lg,
n1ob
 
So behindert sind die gar nicht. Bei einfachen Zuweisungen sind sie oft wesentlich übersichtlicher als if-else-Konstrukte.
 
HTML: 
<html>
<head>
<title>Testseite</title>
</head>
<body>
 
<input type="button" onClick="text_einfuegen()" value="Text erstellen">
<input type="button" onClick="text_loeschen()" value="Text l&ouml;schen">

 
<script>
function text_einfuegen(){
    var textknoten = document.createTextNode("Textknoten");
    document.body.appendChild(textknoten);
}


//funktioniert leider nicht
function text_loeschen(){
    document.body.removeChild(textknoten);
}

</script>
</body>
</html>

so, damit füge ich ja den Text "Textknoten" ein, so jetzt frag ich mich, wie ich den Text etz zum Beispiel am Anfang einfüge und das er auch den Text löscht wenn ich auf "löschen" geh....?

gruß wolf360
 
Da du die Variable
Code: 
textknoten
im Geltungsbereich der Funktion
Code: 
text_einfuegen()
erstellst ist sie in der Funktion
Code: 
text_loeschen()
nicht erreichbar. Die Lösung ist, die Variable global zu definieren damit du in allen Funktionen Zugriff darauf hast.
Code: 
<html>
  <head>
    <title>Testseite</title>
  </head>
  <body>
    <input type="button" onClick="text_einfuegen()" value="Text erstellen">
    <input type="button" onClick="text_loeschen()" value="Text l&ouml;schen">
    <script type="text/javascript">
      var textknoten;
      function text_einfuegen() {
        textknoten = document.createTextNode("Textknoten");
        document.body.appendChild(textknoten);
      }
      function text_loeschen() {
        if (textknoten) {
          document.body.removeChild(textknoten);
        }
      }
    </script>
  </body>
</html>
Um den Text als ersten Knoten im body anzulegen kannst du mal einen Blick auf die Funktion insertBefore() werfen.
Wenn du kompliziertere Modifikationen am DOM vornehmen möchtest solltest du vielleicht mal einen Blick auf eines der zahlreichen JavaScript-Frameworks werfen wie zum Beispiel Prototype. Damit kannst du dir eine Menge Arbeit und Zeit sparen.
 
danke für die hilfe!

gleich zur nächsten frage:

HTML: 
<!--JS Code-->
 function unterseiten(vs) {
	vs = document.getElementById(vs);
	 if (vs.style.visibility == 'hidden') {
 	   vs.style.visibility = 'visible';
              vs.style.display = 'block';
 	  }
 	else {
	 vs.style.visibility = 'hidden';
            vs.style.display = 'none';
	}
      }



<ul>
<li class="navigations_element"><a href="../index.php">Home</a></li>
<li class="navigations_element">
<!--Event-->
<a onClick="unterseiten('test')" href="../gedichte.php">Gedichte</a></li>
	<ul>
            <li id="test" class="unterseiten">Test</li>
         </ul>
<li class="navigations_element"><a href="../bildergallerie.php">Bildergallerie</a></li>
</ul>
also, okey kappt alles ganz gut, blos löst er das Event bei erst beim zweiten mal klicken aus?

okey in meinem Fall führt es das Event gar nicht aus, da ich auch ne Weiterleitung mach, aber geht es auch, das er die Seite lädt wo in href ist und das onClick event?

gruß wolf360
 
Natürlich geht beides aber ich seh den Sinn dahinter nicht eine andere URL aufzurufen und gleichzeitig irgendwelche HTML-Elemente ein/aus zu blenden.
Damit das Ziel deines Links nicht aufgerufen wird kannst du folgendes machen
Code: 
<a href="url.html" onclick="my_function(); return false;">Link</a>
Das
Code: 
return false;
bewirkt, das der Ziel URI nicht aufgerufen wird sondern die Abarbeitung nach dem Aufruf der Funktion
Code: 
my_function()
stoppt.

Das erst beim zweiten Klick Änderungen am DOM sichtbar werden liegt daran, das du das style Attribut überprüfst obwohl es nicht gesetzt ist. Wenn du dem zu überprüfenden Element einen style gibst sollte deine Abfrage auch funktionieren.
Code: 
<script type="text/javascript">
  function my_function(obj_id, trigger) {
    var obj = document.getElementById(obj_id)
    if (!obj) {
      return false;
    }
    if (obj.style.display == 'none') {
      obj.style.display = 'block';
    } else {
      obj.style.display = 'none';
    }
    /**
     * Optional: Die URL des Links aufrufen
     */
    window.location.href = trigger.href;
  }
</script>
<a href="url.html" onclick="my_function('test', this); return false;">Link</a>
<div id="test" style="display:hidden;">Test</div>
Anmerkung: Du musst nicht gleichzeitig die CSS-Eigenschaften 'visibility' und 'display' setzten. Eines von beiden genügt um das entspechende Element ein bzw. aus zu blenden.
 
wenn ich es so wie du mache, werden auch wieder die Unterseiten geschlossen, sobald ich window.location setze.

es soll eine "Hauptseite" für die Unterseiten sein, deshalb brauch ich das die Seite geladen wird und die Unterseiten erscheinen.

aber es geht komischwerweiße immernoch erst auf den zweiten klick....

Code: 
function unterseiten(vs) {
  vs = document.getElementById(vs);
       if (vs.style.display == 'none'){
                     vs.style.display = 'block';
       }
       else {
             vs.style.display = 'none';
       }

}

CSS:
.unterseiten{
display:			none;
list-style-type:  	none;
}

Unterseiten:
<li class="navigations_element">
<a href="../gedichte.php" onClick="unterseiten('test'); return false;"  >Gedichte</a></li>
	<ul>
            <li id="test" class="unterseiten">Eigene</li>
         </ul>
<li class="navigations_element"><a href="../bildergallerie.php">Bildergallerie</a></li>
 
Zuletzt bearbeitet:
wenn ich es so wie du mache, werden auch wieder die Unterseiten geschlossen, sobald ich window.location setze.

es soll eine "Hauptseite" für die Unterseiten sein, deshalb brauch ich das die Seite geladen wird und die Unterseiten erscheinen.
Zum Vergrößern anklicken....
Hast du dir das auch mal ernsthaft durchgelesen? Wer bitte schön soll daraus schlau werden? Ich interpretiere da jetzt einfach mal und glaube, das du ein Frameset benutzt und nur einen bestimmten Frame aktualisieren willst oder?
Wenn du einen Frame hast dann setze das 'name' Attribut dieses Frames um ihn darüber ansprechen zu können.
Code: 
<frameset cols="50%,50%">
  <frame name="links" href="navigation.htm">
  <frame name="rechts" href="inhalt.htm">
</frameset>
Die Zieladressen der Frames könne via JavaScript wie folgt manipuliert werden
Code: 
links.location.href = "url1.htm";
rechts.location.href = "url2.htm";
Zum Thema CSS:
Mit unter funktioniert es nicht, wenn die CSS-Definitionen in einer externen Datei abgelegt sind. Es macht in diesem Fall vielleicht mehr Sinn die Definition direkt über das 'style' Attribut zu setzten. Eine andere Möglichkeit wäre, die if-Abfrage einfach umzudrehen so das als Standard das Element eingeblendet wird
Code: 
if (vs.style.display == 'block') {
  vs.style.display = 'none';
} else {
  vs.style.display = 'block';
}
 
also gut, sorry, wenn ich mich unerständlich ausgedrückt habe.

erstmal nein ich benutze keine Framses, ich will wirklich die Seite laden UND Unterseiten "hinzufügen":

Hier mal das Beispiel:

http://wolf360.wo.funpic.de/gedichte.php

so, wie du evtl. siehst, hast du die Auswahl möglichkeit zwischen Eigene und Andere Gedichte. und unten drunter ist das Formular um mir Gedichte zu schicken.

so, nun will ich abber die Eigenen und die Anderen Gedichte als Unterseiten erstellen, und es soll als "Hauptseite" nur noch das Formular da sein.

hoffe ich hab mich diesmal verständlicher ausgedrückt.

gruß wolf360
 
Sorry aber ich habs immer noch nicht. Was soll eine "Unterseite" und was eine "Hautseite" sein?
Wie willst du JavaScript ausführen und gleichzeitig eine neue Seite laden? Das macht doch alles keinen Sinn.
Wenn's im nächsten Versuch nicht klappt muss ein anderer hier weiter helfen, denn bei diesen unklaren Beschreibungen komm ich nicht mit und verlier die Lust.
 
so:
Code: 
function unterseiten(vs) {
  vs = document.getElementById(vs);
       if (vs.style.display == 'none'){
                     vs.style.display = 'block';
       }
       else {
             vs.style.display = 'none';
       }

}

CSS:
.unterseiten{
display:			none;
list-style-type:  	none;
}

Unterseiten:
<li class="navigations_element">
<a href="../gedichte.php" onClick="unterseiten('test'); return false;"  >Gedichte</a></li>
	<ul>
            <li id="test" class="unterseiten">Eigene</li>
         </ul>
<li class="navigations_element"><a href="../bildergallerie.php">Bildergallerie</a></li>


soooooo, klappt ja alles 1a wie du hier siehst, ist Eigene die Unterseite von Gedichte....

so, aber ich will trotzdem noch die ../gedichte.php laden... und dazu müsst ich ja nur des return false; weg machen,

wenn ich das aber mache, erscheinen die Unterseiten wieder nicht....

und wenn ich ganz unten (siehe dein Script) den window.location befehl Setze, kommen die Unterseiten zwar kurz, aber sobald er weiterleitet, verschwinden die Unterseiten wieder.....

hoff, diesmal hast dus verstanden.....


gruß wolf360
 
Ich denke schon.
Du hast also eine Art Klappmenü das sich via JavaScript öffnet/schliesst. Dein Problem ist jetzt, wenn du auf einen der Ausgeklappten Untermenüpunkte klickst und die Seite neu läd, wird der Untermenüpunkt nicht automatisch ausgeklappt dargestellt.
Mir fallen jetzt spontan 2 Möglichkeiten zur Lösung ein:
1. Ein JavaScript Cookie
2. Ein angepasstes JavaScript für die Unterseiten oder eine Serverseitige Behandlung (vielleicht mit PHP)
 
okey, danke für die hilfe!

gleich zu nächsten frage:

wie kann ich überprüfen ob ein Textknoten bereits vorhanden ist?
Code: 
<body>

<form method="post" name="formular">
<input type="text" value="Feld1"><br>
<input type="text" value="Feld2"><br>
<input type="text" value="Feld3"><br>
<input type="text" value="Feld4"><br>
<input type="text" value="Feld5"><br>
</form>
<input type="button" onClick="ausgabe()" value="Pruefen">
<input type="button" onClick="test()" value="Test">


<script>

function ausgabe(){
			var laenge = document.formular.length;
			 for(var i = 0; i <= laenge ; i++){

			 	var element = document.createElement("br");
			 document.body.appendChild(element);

			 if(document.formular[i].value == ""){
				var text = document.createTextNode("Feld "+ i + " ist Leer" );
			 }else{
				var text = document.createTextNode("Feld "+ i + " ist voll" );
			 }

                                if(textknoten vorhanden){
			 document.body.replaceChild(textalt, text);
			 }else{
			document.body.appendChild(text);
			 }

			}
	}

</script>
</body>
 
Pack den Text in ein span-Element und gib diesem eine ID, dann kannst du prüfen ob das Element vorhanden ist.
 
okey... irgendwie mach ich was falsch:

Code: 
<body>

<form method="post" name="formular">
<input type="text" value="Feld1"><br>
<input type="text" value="Feld2"><br>
<input type="text" value="Feld3"><br>
<input type="text" value="Feld4"><br>
<input type="text" value="Feld5"><br>
</form>
<input type="button" onClick="ausgabe()" value="Pruefen">
<input type="button" onClick="test()" value="Test"><br>

<span id="test">

</span>

<script>

function ausgabe(){
	var laenge = document.formular.length;

				     for(var i = 0; i <= laenge ; i++){


		     		var element = document.createElement("br");
			       document.body.appendChild(element);

			       if(document.formular[i].value == ""){
					var text = document.createTextNode("Feld "+ i + " ist Leer" );
			       }else{
					var text = document.createTextNode("Feld "+ i + " ist voll" );
			       }

                          	document.getElementById("test").appendChild(text);
				document.getElementById("test").appendChild(element);
		     }

	    }



function test(){
if(document.getElementById("test").text == true){
             document.write("ja");
}else{
	      document.write(document.getElementById("test").childNodes.length);
}


}
</script>
</body>
 
Code: 
<body>
  <form method="post" name="formular">
    <input type="text" value="Feld1" /><br />
    <input type="text" value="Feld2" /><br />
    <input type="text" value="Feld3" /><br />
    <input type="text" value="Feld4" /><br />
    <input type="text" value="Feld5" /><br />
  </form>
  <input type="button" onClick="ausgabe()" value="Pruefen" />
  <input type="button" onClick="test(0)" value="Test" />
  <br />

  <div id="output"></div>

  <script type="text/javascript">
    function ausgabe() {
      for(var i = 0; i <= document.formular.length ; i++) {
        var container = document.getElementById("output");
        var linebreak = document.createElement("br");
        var wrapper = document.createElement('span');
        wrapper.id = 'text-node' + i;
        if (document.formular[i].value == "") {
          wrapper.appendChild(document.createTextNode('Feld ' + i + ' ist Leer'));
        } else {
          wrapper.appendChild(document.createTextNode('Feld ' + i + ' ist voll'));
        }
        container.appendChild(wrapper);
        container.appendChild(linebreak);
      }
    }

    function test(node_id) {
      var node = document.getElementById('text-node' + node_id);
      if (node) {
        alert('Node value of node ' + node_id + ' is: ' + node.innerHTML);
      } else {
        alert('Node ' + node_id + ' could not be found!');
      }
    }
  </script>

</body>
 
okey danke hat geklappt, nochmal ne frage zu den Unterseiten script....


wie mach ich des etz, das das script auch beim ersten Klick ausführt und nicht erst beim zweiten oder dritten?

Ich hab etz scho probiert:
CSS-Datei extern: 2 Klicks;
CSS in der selben datei: 2 klicks:
style angabe direkt im tag: 1 Klick.

kann man das nicht irgendwie machen, das er das Script trotz externer Datei mit einem Klick ausführt?

oder is es in diesem fall ein MUSS das man es direkt im HTML-Tag angeben muss?
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben