nicht angemeldet
unterschiedliche Infos an gleicher Stelle im Fenser einblenden
Hallo!
Hoffentlich kann mir jemand helfen: Ich möchte das folgende Script in meine Seiten einbinden:
<html>
<head>
...
<script type="text/javascript">
<!--
function sichtbar(a) {
document.getElementById("unsichtbar").style.display=(a)?"block":"none";
}
// -->
</script>
</head>
<body onload="sichtbar(false)">
<div id="unsichtbar">Geheim</div>
<a href="javascript:sichtbar(true)">Anzeigen</a></div>
</body>
</html>
Das Grundgerüst der Webpräsenz ist allerdings in PHP geschrieben (falls das wichtig ist).
Das Script selbst funktioniert so ganz gut. Problem/Frage: Ich möchte unterschiedliche (Geheim-)Inhalte über die verschiedenen Links einblenden. Klickt man auf Link 1 soll die zuvor nicht sichtbare Botschaft 1 eingeblendet werden. Wenn man auf einen Link 2 klickt, dann soll eine andere Botschaft (2) eingeblendet werden, aber an der gleichen Stelle, wie zuvor die Botschaft 1. Theoretisch könnte man mit Frames arbeiten, aber das möchte ich aus diversen Gründen vermeiden. Wenn ich eine zweite Funktion (sichtbar1) einbinde, dann wird die erste damit leider zerstört und die Information 1 ist von Anfang an sichtbar. Was kann ich also tun?
-
Hi,
Das Grundgerüst der Webpräsenz ist allerdings in PHP geschrieben
PHP fidet auf dem Server statt, Javascript beim Client (idR.)
Ich möchte unterschiedliche (Geheim-)Inhalte über die verschiedenen Links einblenden.
Was im Quellcode steht ist _nie_ geheim.
Wenn ich eine zweite Funktion (sichtbar1) einbinde, dann wird die erste damit leider zerstört und die Information 1 ist von Anfang an sichtbar.
Einer Funktion kannst Du Parameter übergeben, dazu sind die Klammern da. Übergib dem Aufruf also als String die gewuenschte ID, und setze diese in die Dom-Methode ein.
function sichtbar(a,el) {
document.getElementById(el).style.display=(a)?"block":"none";
}sichtbar(true,"unsichtbar");
Gruesse, Joachim
--
Am Ende wird alles gut. -
Hallo Chrostoffer,
Theoretisch könnte man mit Frames arbeiten, aber das möchte ich aus diversen Gründen vermeiden. Wenn ich eine zweite Funktion (sichtbar1) einbinde, dann wird die erste damit leider zerstört und die Information 1 ist von Anfang an sichtbar. Was kann ich also tun?
aua! Aua! Aua! ;) Du verkennst noch die Möglichkeiten, die Dir JavaScript an die Hand gibt. Frames brauchst Du Dafür nicht.
Ich möchte Dich auch gleich auf eine weitere Diskussion hier im Forum aufmerksam machen, die das Verhalten der Suchmaschinerie "Google" betrifft: https://forum.selfhtml.org/?t=123033&m=791798
Wenn die Inhalte auch für Suchmaschinen relevant sind, so denke bitte auch über den sinnvollen Eisatz von <noscript>-Elementen nach.Das Script selbst funktioniert so ganz gut. Problem/Frage: Ich möchte unterschiedliche (Geheim-)Inhalte über die verschiedenen Links einblenden. Klickt man auf Link 1 soll die zuvor nicht sichtbare Botschaft 1 eingeblendet werden. Wenn man auf einen Link 2 klickt, dann soll eine andere Botschaft (2) eingeblendet werden, aber an der gleichen Stelle, wie zuvor die Botschaft 1.
Ein Beispiel:
<?xml version="1.0" encoding="ISO-8859-1"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head> <title>Under Construction</title> <script type="application/x-javascript">function zeige_text(a,b){ var a=document.getElementById(a) var b=a.getElementsByTagName('noscript')[b] if(a.getElementsByTagName('div').length>0) a.removeChild(a.getElementsByTagName('div')[0]) var c=b.firstChild.cloneNode(true) var d=document.createElement('div') d.appendChild(c) a.appendChild(d) } ~~~~~~html </script> <style type="text/css"> li {text-decoration:underline;color:blue} li:hover{color:red} </style> </head> <body> <ul> <li onclick="zeige_text('a1',0)">Hinterm Mond</li> <li onclick="zeige_text('a1',1)">Wird alles gut?</li> <li onclick="zeige_text('a2',0)">Was sagt Susi?</li> <li onclick="zeige_text('a2',1)">Noch was</li> </li> <div id="a1"> <h1>Hallo Welt!</h1> <noscript>Es ist nur ein kleiner Text für ein Element. Aber ein großer Text für das Dokument.</noscript> <noscript>Alles wird gut. Wer hat da gelacht?!</noscript> </div> <div id="a2"> <h1>Susi Sorglos:</h1> <noscript>Zitat 1.</noscript> <noscript>nix</noscript> </div> </body> </html>Gruß aus Berlin!
eddi--
Wer Rechtschreibfehler findet, darf sie behalten.-
Hallo,
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">Ah Ja, XHTML1.1, toll, hype!
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title>Under Construction</title>
<script type="application/x-javascript">[/code]^und der IE?
function zeige_text(a,b){
var a=document.getElementById(a)
var b=a.getElementsByTagName('noscript')[b]if(a.getElementsByTagName('div').length>0)
a.removeChild(a.getElementsByTagName('div')[0])var c=b.firstChild.cloneNode(true)
var d=document.createElement('div')d.appendChild(c)
a.appendChild(d)
}
</script>
<style type="text/css">
li {text-decoration:underline;color:blue}
li:hover{color:red}
</style>
</head>
<body>
<ul>
<li onclick="zeige_text('a1',0)">Hinterm Mond</li>
<li onclick="zeige_text('a1',1)">Wird alles gut?</li>
<li onclick="zeige_text('a2',0)">Was sagt Susi?</li>
<li onclick="zeige_text('a2',1)">Noch was</li>
</li>^sicher ein Tippfehler.
</ul><div id="a1">
<h1>Hallo Welt!</h1>
<noscript>Es ist nur ein kleiner Text für ein Element. Aber ein großer Text für das Dokument.</noscript>noscript darf keine Zeichendaten direkt enthalten.[1]
<noscript>Alles wird gut. Wer hat da gelacht?!</noscript>
noscript darf keine Zeichendaten direkt enthalten.[1]
</div>
<div id="a2">
<h1>Susi Sorglos:</h1>
<noscript>Zitat 1.</noscript>noscript darf keine Zeichendaten direkt enthalten.[1]
<noscript>nix</noscript>
noscript darf keine Zeichendaten direkt enthalten.[1]
</div>
</body>
</html>Wegen [1] möchtest Du auch Dein Script nochmal vollständig überarbeiten.
viele Grüße
Axel
-
Hallo Axel,
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Ah Ja, XHTML1.1, toll, hype!<script type="application/x-javascript">[/code]
^und der IE?<ul>
<li onclick="zeige_text('a1',0)">Hinterm Mond</li>
<li onclick="zeige_text('a1',1)">Wird alles gut?</li>
<li onclick="zeige_text('a2',0)">Was sagt Susi?</li>
<li onclick="zeige_text('a2',1)">Noch was</li>
</li>
^sicher ein Tippfehler.<noscript>Es ist nur ein kleiner Text für ein Element. Aber ein großer Text für das Dokument.</noscript>
noscript darf keine Zeichendaten direkt enthalten.[1]Das ist nur schnell aus einem bestehendem Dokument, was ich mal für den FF benötigt habe, um eine grafische Oberfläche zu realisieren abkopiert. "Hype" soll es nicht sein.
Wegen [1] möchtest Du auch Dein Script nochmal vollständig überarbeiten.
Werde ich wohl müssen, da Du es freundlicher Weise nicht getan hast:
<?xml version="1.0" encoding="ISO-8859-1"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head> <title>Under Construction</title> <script type="application/x-javascript">function zeige_text(a,b){ var a=document.getElementById(a) var b=a.getElementsByTagName('noscript')[b] if(a.getElementsByTagName('div').length>0) a.removeChild(a.getElementsByTagName('div')[0]) var c=document.createTextNode(b.firstChild.nodeValue.substr(3,b.firstChild.nodeValue.length-7)) var d=document.createElement('div') d.appendChild(c) a.appendChild(d) }</script> <style type="text/css"> li {text-decoration:underline;color:blue} li:hover{color:red} </style> </head> <body onload="showModalDialog('form.htm')"> <ul> <li onclick="zeige_text('a1',0)">Hinterm Mond</li> <li onclick="zeige_text('a1',1)">Wird alles gut?</li> <li onclick="zeige_text('a2',0)">Was sagt Susi?</li> <li onclick="zeige_text('a2',1)">Noch was</li> </ul> <div id="a1"> <h1>Hallo Welt!</h1> <noscript><p>Es ist nur ein kleiner Text für ein Element. Aber ein großer Text für das Dokument.</p></noscript> <noscript><p>Alles wird gut. Wer hat da gelacht?!</p></noscript> </div> <div id="a2"> <h1>Susi Sorglos:</h1> <noscript><p>Zitat 1.</p></noscript> <noscript><p>nix</p></noscript> </div> </body> </html>Du "möchtest" bitte so nett sein, da ich kein IE habe, für Kompatibilität zum IE zu sorgen.
Gruß aus Berlin!
eddi--
Wer Rechtschreibfehler findet, darf sie behalten.-
Hallo eddi!
Du "möchtest" bitte so nett sein, da ich kein IE habe, für Kompatibilität zum IE zu sorgen.
Weil die Bauarbeiter selbst keinen Rollstuhl haben, wissen sie nicht wie man einen behindertengerechten Zugang zum Gebäude baut und lassen es deshalb lieber? Sind dies dann in Deinen Augen gute Bauarbeiter?
Schönen Gruß
Afra
-
Hallo Afra!
Du "möchtest" bitte so nett sein, da ich kein IE habe, für Kompatibilität zum IE zu sorgen.
Weil die Bauarbeiter selbst keinen Rollstuhl haben, wissen sie nicht wie man einen behindertengerechten Zugang zum Gebäude baut und lassen es deshalb lieber? Sind dies dann in Deinen Augen gute Bauarbeiter?
*lach* der Vergleich ist böse und hinkt nicht mal ;)
Aber ich nehme an, Du bist immernoch nachtragent wegen https://forum.selfhtml.org/?t=122833&m=790777 und suchst nun nach einem Grund zu zeigen, wie Klasse Du doch eigentlich bist. Werde doch hier auch produktiv statt zu bekritteln und verbessere den Code, damit wir alle bei dem doch recht turnusmäßigem "Wechsel" an Fragen eine Referenz im Archiv parat haben werden.
Gruß aus Berlin!
eddi--
Wer Rechtschreibfehler findet, darf sie behalten.-
Hallo!
Du "möchtest" bitte so nett sein, da ich kein IE habe, für Kompatibilität zum IE zu sorgen.
Weil die Bauarbeiter selbst keinen Rollstuhl haben, wissen sie nicht wie man einen behindertengerechten Zugang zum Gebäude baut und lassen es deshalb lieber? Sind dies dann in Deinen Augen gute Bauarbeiter?
*lach* der Vergleich ist böse und hinkt nicht mal ;)
Aber ich nehme an, Du bist immernoch nachtragent wegen https://forum.selfhtml.org/?t=122833&m=790777
Keinesfalls bin ich nachtragend. Ich hatte mich über mich selbst geärgert, dass ich nicht bemerkt habe, dass Du völlig anderen Code nennst. Aber das ist jetzt auch vorbei.
Das hier ist selfHTML und man sollte die Leute nicht mit fertigem Code zuschmeißen, den diese wahrscheinlich nicht einmal verstehen. Wenn Du meine anderen Antworten im Forum lesen würdest, würdest Du sehen, dass da fast immer ein Danke am Ende steht, oder keinerlei weitere Diskussionen aufkommen.
Schönen Gruß
Afra
-
Re:
Aber ich nehme an, Du bist immernoch nachtragent wegen https://forum.selfhtml.org/?t=122833&m=790777
Keinesfalls bin ich nachtragend.
Dann war der nicht ganz geglückte Verweis auf "Komsiche deutsche Burschen" also auch reiner Zufall?
Das hier ist selfHTML und man sollte die Leute nicht mit fertigem Code zuschmeißen, den diese wahrscheinlich nicht einmal verstehen.
Wenn sie ihn nicht verstehen sollten, ihn dennoch nutzen, dann ist es Sache der Hilfesuchenden nachzufragen. Ob sie dies in Einsicht tun, um sich mit einem Problem einfürallemal auseinander zu setzen, oder ob es ungewollt zwangsläufig geschieht, weil eine vereinfachte Darstellung der Problematik im ursprünglich Speziellen dann doch nicht so funktioniert, ist dabei fast schon egal. Ich halte es für besser erst das Interesse am Verständnis durch scheinbar funktionierendes zu wecken, als gleich mit Manual zu drohen. Denn vorm grundsätzlichem Studium einer Materie führt kein Weg vorbei.
In dem Sinne bin ich eher ein Anhäger regulierender Dynamik (Bretter, Köpfe, Murmeltiere und Grüße und so ;)
Gruß aus Berlin!
eddi--
Wer Rechtschreibfehler findet, darf sie behalten.
-
-
-
-
Hallo,
var c=document.createTextNode(b.firstChild.nodeValue.substr(3,b.firstChild.nodeValue.length-7))
Ja, und genau deshalb würde ich die JavaScript-Spielerei mit dem NOSCRIPT-Element, dessen Kindelemente nur dann im Elementbaum hängen, wenn eben _kein_ JavaScript ausgeführt wird, unterlassen ;-).
Du hast sicherlich bemerkt, dass es das P-Element im NOSCRIPT-Element für JavaScript-DOM eben nicht gibt.Du "möchtest" bitte so nett sein, da ich kein IE habe, für Kompatibilität zum IE zu sorgen.
Bitte:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Under Construction</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <script type="text/javascript"> function zeige_text(a,b){ var a=document.getElementById(a); var b=a.getElementsByTagName('noscript')[b]; if(a.getElementsByTagName('div').length>0) a.removeChild(a.getElementsByTagName('div')[0]); var t = b.nodeValue; //für Opera ist hier am NOSCRIPT weder firstChild noch innerHTML, muss auch nicht ;-) if (b.firstChild) { t = b.firstChild.nodeValue; t = t.substr(3,t.length-7); } else if (b.innerHTML) { t = b.innerHTML.toString(); t = t.substr(3,t.length-7); } var c=document.createTextNode(t); var d=document.createElement('div'); d.appendChild(c); a.appendChild(d); } </script> <style type="text/css"> li {text-decoration:underline;color:blue} li:hover{color:red} </style> </head> <body> <ul> <li onclick="zeige_text('a1',0)">Hinterm Mond</li> <li onclick="zeige_text('a1',1)">Wird alles gut?</li> <li onclick="zeige_text('a2',0)">Was sagt Susi?</li> <li onclick="zeige_text('a2',1)">Noch was</li> </ul> <div id="a1"> <h1>Hallo Welt!</h1> <noscript><p>Es ist nur ein kleiner Text für ein Element. Aber ein großer Text für das Dokument.</p></noscript> <noscript><p>Alles wird gut. Wer hat da gelacht?!</p></noscript> </div> <div id="a2"> <h1>Susi Sorglos:</h1> <noscript><p>Zitat 1.</p></noscript> <noscript><p>nix</p></noscript> </div> </body> </html>viele Grüße
Axel
-
Hallo,
var c=document.createTextNode(b.firstChild.nodeValue.substr(3,b.firstChild.nodeValue.length-7))
Ja, und genau deshalb würde ich die JavaScript-Spielerei mit dem NOSCRIPT-Element, dessen Kindelemente nur dann im Elementbaum hängen, wenn eben _kein_ JavaScript ausgeführt wird, unterlassen ;-).Auch wenn ersteinmal zu vermuten ist, daß nur händisch Webs von google ausgesperrt werden (https://forum.selfhtml.org/?t=123033&m=791798), was würdest Du im Hinblick auf -relevanten Inhalt für Suchmaschine- vorschlagen, stattdessen zu nutzen?
Du hast sicherlich bemerkt, dass es das P-Element im NOSCRIPT-Element für JavaScript-DOM eben nicht gibt.
Die Erfahrung fehlte mir - in der Tat. Jetzt ist sie auch abrufbar. Danke!
Gruß aus Berlin!
eddi--
Wer Rechtschreibfehler findet, darf sie behalten.-
Hallo,
Auch wenn ersteinmal zu vermuten ist, daß nur händisch Webs von google ausgesperrt werden (https://forum.selfhtml.org/?t=123033&m=791798), was würdest Du im Hinblick auf -relevanten Inhalt für Suchmaschine- vorschlagen, stattdessen zu nutzen?
Im konkreten Beispiel kann man allen Inhalt in normale HTML-Elemente schreiben. Inhalte, die von Browsern, welche JavaScript unterstützen, nicht angezeigt bzw. erst später eingeblendet werden sollen, werden window.onload auf style.display = "none" gesetzt. Clients, die kein JavaScript unterstützen, zeigen den kompletten Inhalt sofort an, egal, ob sie nun CSS umsetzen oder nicht.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Under Construction</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <script type="text/javascript"> <!-- function zeige_text(a, b){ var a = document.getElementById(a); var allP = a.getElementsByTagName('p'); for (var i = 0; i < allP.length; i++) { if (allP[i].className == 'jsEA' && allP[i].id == b) { allP[i].style.display='block'; } else if (allP[i].className == 'jsEA') { allP[i].style.display='none'; } } } window.onload = function() { var allP = document.getElementsByTagName('p'); for (var i = 0; i < allP.length; i++) { if (allP[i].className == 'jsEA') allP[i].style.display='none'; } } //--> </script> <style type="text/css"> p#jsEA {margin:0; padding:0;} </style> </head> <body> <ul> <li><a href="#" onclick="zeige_text('a1','a1_1')">Hinterm Mond</a></li> <li><a href="#" onclick="zeige_text('a1','a1_2')">Wird alles gut?</a></li> <li><a href="#" onclick="zeige_text('a2','a2_1')">Was sagt Susi?</a></li> <li><a href="#" onclick="zeige_text('a2','a2_2')">Noch was</a></li> </ul> <div id="a1"> <h1>Hallo Welt!</h1> <p class="jsEA" id="a1_1">Es ist nur ein kleiner Text für ein Element. Aber ein großer Text für das Dokument.</p> <p class="jsEA" id="a1_2">Alles wird gut. Wer hat da gelacht?!</p> </div> <div id="a2"> <h1>Susi Sorglos:</h1> <p class="jsEA" id="a2_1">Zitat 1.</p> <p class="jsEA" id="a2_2">nix</p> </div> </body> </html>Ein Problem besteht doch eigentlich nur dann, wenn sofort per CSS display:none gesetzt wird. Dann zeigen Browser die CSS umsetzen den Inhalt nie an, es sei denn er wird später irgendwann mit JavaScript eingeblendet. Dann kann er aber auch mit JavaScript ausgeblendet werden und muss nicht im CSS display:none gesetzt werden.
viele Grüße
Axel
-
Re:
Auch wenn ersteinmal zu vermuten ist, daß nur händisch Webs von google ausgesperrt werden (https://forum.selfhtml.org/?t=123033&m=791798), was würdest Du im Hinblick auf -relevanten Inhalt für Suchmaschine- vorschlagen, stattdessen zu nutzen?
Im konkreten Beispiel kann man allen Inhalt in normale HTML-Elemente schreiben. Inhalte, die von Browsern, welche JavaScript unterstützen, nicht angezeigt bzw. erst später eingeblendet werden sollen, werden window.onload auf style.display = "none" gesetzt. Clients, die kein JavaScript unterstützen, zeigen den kompletten Inhalt sofort an, egal, ob sie nun CSS umsetzen oder nicht.
Ein Problem besteht doch eigentlich nur dann, wenn sofort per CSS display:none gesetzt wird. Dann zeigen Browser die CSS umsetzen den Inhalt nie an, es sei denn er wird später irgendwann mit JavaScript eingeblendet. Dann kann er aber auch mit JavaScript ausgeblendet werden und muss nicht im CSS display:none gesetzt werden.
Dem stimme ich soweit auch zu. Beispielsweise 1&1 gestaltet so gewisse Funktionalitäten einiger Dokumente. Semantisch ist es nicht korrekt; aber das ist eine grundsätzliche Sache wie Gestaltung mittels Tablen auch.
Abzuwarten bleibt, wie die Suchmaschinerie mit beidem umgehen wird.Anzumerken bleibt, das diese, Deine Methode sich auf die selben Funktionen JavaScripts basiert, was das Ein- und Ausblenden betrifft. Das ist von Vorteil bei uralten Browsern.
Gruß aus Berlin!
eddi--
Wer Rechtschreibfehler findet, darf sie behalten.
-
-
-
-
-
-
-
Hi,
Wenn ich eine zweite Funktion (sichtbar1) einbinde, dann wird die erste damit leider zerstört und die Information 1 ist von Anfang an sichtbar.
Nein, ist sie nicht, sofern Du keinen Fehler gemacht hast.
Ansonsten würde ich her eher ein einziges DIV "unsichtbar" nehmen, und dort mit innerHTML reinknallen, was immer ich gerade brauche.
<a href="javascript:sichtbar(true)">Anzeigen</a></div>
Und das wurde ich auch mit document.write schreiben. Denn ohne JS ist der Link ziemlich sinnfrei. :)
Gruß, Cybaer
--
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!