nicht angemeldet
removeChild funktioniert bei mir nicht
StruppiHallo,
ich habe hier ein Gästebuchformular, bei dem u.a. die eMail-Adresse geprüft wird.
Ist sie falsch geschrieben, dann wird nach dem Klick auf "Speichern" unterhalb des Formulars ein Hinweis gegeben. Drücke ich jetzt noch einmal auf Speichern, dann wird neben dieser Meldung, die gleiche Meldung angehängt. Beim Klick auf "zurücksetzen" wird die Meldung auch nicht gelöscht.
Mein Ziel ist es, dass die Meldung nur einmal erscheint und beim Klick auf "zurücksetzen" wieder verschwindet.
Wer es testen möchte kann das GB unter http//www.foto.zarm.net/foto/gbe.php aufrufen. (Die Seite befindet sich noch im Aufbau) - einfach ein Zeichen bei Email eingeben und dann ein paar mal auf "Speichern" klicken.
Nebenbei bemerkt, ich bin blutiger Anfänger in Sachen JavaScript/HTML/CSS - also verzeiht mir etwaige Fehler.
Gruß
Andreas
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="imagetoolbar" content="false" />
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
<script type="text/javascript" src="js/showpic.js"></script>
<style type="text/css">
@import 'css/style.css';
</style>
<title>ZARM.NET | Fotografien von Andreas Zarm</title>
</head>
<!-- hier wird gesprüft, ob im Feld Name und Eintrag etwas steht und ob die eMail richtig ist-->
<script language="JavaScript" type="text/javascript">
function leeren() {
document.forms[0].name.style.background = "#FFFFFF";
document.forms[0].eintrag.style.background = "#FFFFFF";
document.forms[0].email.style.background = "#FFFFFF";
var alarmtext = document.createTextNode();
document.getElementById("alarm").removeChild(alarmtext);
}
function pruefen() {
if ((document.forms[0].email.value.indexOf("@") == -1 || document.forms[0].email.value.indexOf(".") == -1) && document.forms[0].email.value != '') {
document.forms[0].email.style.background = "#FFFF66";
var alarmtext = document.createTextNode("E-Mail falsch geschrieben!");
document.getElementById("alarm").appendChild(alarmtext);
return false;
} else {
var name = document.forms[0].name.value;
var text = document.forms[0].eintrag.value;
if(name == "") {
document.forms[0].name.style.background = "#FFFF66";
document.forms[0].name.focus();return false;
}
if(text == "") {
document.forms[0].eintrag.style.background = "#FFFF66";
document.forms[0].eintrag.focus();return false;
}
}}
</script>
<body>
<div id="container">
<div id="header">
<h1 id="description">ZARM.NET | Fotografien von Andreas Zarm</h1>
</div>
<div id="showcase" style="margin-left:auto; margin-right:auto;">
<!-- Formular für den Gästebucheintrag -->
<form name="" action="/foto/gbe.php" method="post" enctype="text/html" onSubmit="return pruefen()">
<p><label>Name:*</label><input type="text" name="name" value="" size="50" maxlength="150" />
<br />
</p>
<p><label>E-Mail-Adresse:</label> <input type="text" name="email" value="" size="50" maxlength="150" />
<br /></p>
<p><label>Homepage:</label> <input type="text" name="url" value="" size="50" maxlength="150" />
<br /></p>
<p><label>Gästebucheintrag:*</label> <textarea name="eintrag" rows="10" cols="50" /></textarea>
<br /></p>
<p style="margin-left:185px"><input type="submit" id="submit" value="speichern" /> <input type="reset" id="reset" value="zurücksetzen" onClick="leeren()"/>
<br /></p>
<div id="alarm" style="color:#FF9900; margin-left:210px; margin-top:10px;"></div>
</form>
</div>
<div id="menu">
<a href="index.html"onFocus="if(this.blur)this.blur()">Home</a> |
<a href="about.html"onFocus="if(this.blur)this.blur()">About</a> |
<a href="impressum.html"onFocus="if(this.blur)this.blur()">Impressum</a> |
<a href="gb.php"onFocus="if(this.blur)this.blur()">Gästebuch</a>
</div>
</div>
</body>
</html>
-
Wer es testen möchte kann das GB unter http//www.foto.zarm.net/foto/gbe.php aufrufen. (Die Seite befindet sich noch im Aufbau) - einfach ein Zeichen bei Email eingeben und dann ein paar mal auf "Speichern" klicken.
Nimm statt appendChild innerHTML, ist zwar nicht Standardkonform, funktioniert aber mittlerweile in allen Browsern.
<a href="index.html"onFocus="if(this.blur)this.blur()">Home</a> |
Das (this.blur()) ist übrigens reichlich unschön, du verhinderst damit eine Navigation auf die Links per Tastatur, worauf manche Menschen angewiesen sind.
Struppi.
-
Hallo,
> function leeren() { > //... > var alarmtext = document.createTextNode(); > document.getElementById("alarm").removeChild(alarmtext); > }naja, du möchtest ja den schon vorhandenen Text entfernen und nicht noch einen weiteren erzeugen.
var alarmtext = document.createTextNode();
ohne Argument ist das sowieso fehlerhaft.
function leeren() { // ... var alarm=document.getElementById("alarm"); if (alarm.firstChild) { alarm.removeChild(alarm.firstChild); // das wäre ein zuvor mit appendChild() angefügter Text }unter der Voraussetzung, dass es nur 1 child gibt ...
<div id="alarm" style="color:#FF9900; margin-left:210px; margin-top:10px;"></div>
Gruß plan_B
--
*®*´¯`·.¸¸.·-
Hallo plan_B,
leider funktioniert das ganze nicht, der beschriebene Fehler ist immer noch da.
meine function sieht jetzt so aus,function leeren() { document.forms[0].name.style.background = "#FFFFFF"; document.forms[0].eintrag.style.background = "#FFFFFF"; document.forms[0].email.style.background = "#FFFFFF"; //var alarmtext = document.createTextNode(); //document.getElementById("alarm").appendChild(alarmtext); var alarm=document.getElementById("alarm"); if (alarm.firstChild) { alarm.removeChild(alarm.firstChild); // das wäre ein zuvor mit appendChild() angefügter Text } }Gruß
AndreasHallo,
function leeren() {
//...
var alarmtext = document.createTextNode();
document.getElementById("alarm").removeChild(alarmtext);
}> naja, du möchtest ja den schon vorhandenen Text entfernen und nicht noch einen weiteren erzeugen. > > > var alarmtext = document.createTextNode(); > ohne Argument ist das sowieso fehlerhaft. > > ~~~javascript > function leeren() { > // ... > var alarm=document.getElementById("alarm"); > if (alarm.firstChild) { > alarm.removeChild(alarm.firstChild); // das wäre ein zuvor mit appendChild() angefügter Text > } > >unter der Voraussetzung, dass es nur 1 child gibt ...
<div id="alarm" style="color:#FF9900; margin-left:210px; margin-top:10px;"></div>
Gruß plan_B
-
Hallo,
leider funktioniert das ganze nicht, der beschriebene Fehler ist immer noch da.
nun, ich habe mir einen Fehler rausgepickt und gezeigt, wie ein existierender Textknoten entfernt wird. Nehme mal an, das funktioniert.
in deiner Prüffunktion erzeugst du nun im Fehlerfall immer eine neue Fehlermeldung, ohne zu prüfen, ob diese Meldung schon ausgegeben wurde. Jetzt müsste es doch wohl mit einer Abfrage hinzukriegen sein, das zu kontrollieren ...
Denke, das waren die logischen Fehler. Wenn jetzt noch syntakische auftreten, zeigt das die Fehlerkonsole des Browsers recht genau an ( Firefox o. Opera)
Gruß plan_B
ps: bitte blähe diesen Thread nicht mit unnötigen Zitaten auf.
--
*®*´¯`·.¸¸.·-
Hallo plan_B
anscheinend ist mir irgendwo ein Fehler unterlaufen, also das Zurücksetzen funktioniert nun doch mit deinem Code.
Allerdings das wird immernoch die Meldung beim mehrfachen Klicken hinter die alte gehängt.
Hast du dafür vielleicht auch eine Lösung ???
Gruß
Andreas
-
-
Hallo Struppi
ich habs jetzt mal mit innerHTML probiert. Es funktioniert auch ganz gut (und war auch garnicht mal kompliziert) aber wenn ich nach dem Zurücksetzen erneut prüfe, dann erscheint bei fehlerhafter Email keine Warnmeldung.
Wie kann ich das am besten lösen? mit nem Reload der Seite nach dem zurücksetzen würds gehen (find ich aber nicht schick)!
Hier mal der Code:
function leeren() { document.forms[0].name.style.background = "#FFFFFF"; document.forms[0].eintrag.style.background = "#FFFFFF"; document.forms[0].email.style.background = "#FFFFFF"; document.getElementById('alarm').style.display = 'none'; } function pruefen() { if ((document.forms[0].email.value.indexOf("@") == -1 || document.forms[0].email.value.indexOf(".") == -1) && document.forms[0].email.value != '') { document.forms[0].email.style.background = "#FFFF66"; var meldung = 'email falsch!' document.getElementById("alarm").innerHTML=meldung; return false; } else { var name = document.forms[0].name.value; var text = document.forms[0].eintrag.value; if(name == "") { document.forms[0].name.style.background = "#FFFF66"; document.forms[0].name.focus();return false; } if(text == "") { document.forms[0].eintrag.style.background = "#FFFF66"; document.forms[0].eintrag.focus();return false; } }}-
ich habs jetzt mal mit innerHTML probiert. Es funktioniert auch ganz gut (und war auch garnicht mal kompliziert) aber wenn ich nach dem Zurücksetzen erneut prüfe, dann erscheint bei fehlerhafter Email keine Warnmeldung.
Hast du mal geguckt ob eine Fehlermeldung in der Fehlerkonsole angezeigt wird?
Struppi.
-
es wird ein syntax error in Zeile 1 angezeigt, wüsste aber nicht, wo der sein sollte.
Gruß
AndreasHast du mal geguckt ob eine Fehlermeldung in der Fehlerkonsole angezeigt wird?
Struppi.
-
es wird ein syntax error in Zeile 1 angezeigt, wüsste aber nicht, wo der sein sollte.
Wir auch nicht, was ist die Zeile 1?
Struppi.
-
-
-
Hallo,
du hast Recht, man braucht nicht alles verstehen. Aber wenn du hier mal einen Codeschnipsel ausprobierst und an anderer Stelle eine andere Technik, ohne dir über die Wirkungsweise klarzuwerden, dann verzichte lieber auf solche Programmierung.
Gruß plan_B
--
*®*´¯`·.¸¸.·
-
-
-
-
-
leider funktioniert das ganze nicht, der beschriebene Fehler ist immer noch da.
Mal was anderes, warum willst du den den Knoten unbedingt entfernen? Du kannst den Inhalt doch Problemlos überschreiben, sogar mit richtigen DOM Funktion bzw. Eigenschaften (z.b. .data), wenn dir innerHTML (Warum auch immer) nicht behagt. Aber erzeugen, einhängen, entfernen, erzeugen, einghängen.... ist doch viel zu umständlich.
Struppi.
-
Wie bereits erwähnt, ich bin blutiger Anfänger. Ich suche nach Scriptschnipseln die passen könnten und versuche dann, sie in meine Seite einzubauen.
Andreas
leider funktioniert das ganze nicht, der beschriebene Fehler ist immer noch da.
Mal was anderes, warum willst du den den Knoten unbedingt entfernen? Du kannst den Inhalt doch Problemlos überschreiben, sogar mit richtigen DOM Funktion bzw. Eigenschaften (z.b. .data), wenn dir innerHTML (Warum auch immer) nicht behagt. Aber erzeugen, einhängen, entfernen, erzeugen, einghängen.... ist doch viel zu umständlich.
Struppi.
-
Wie bereits erwähnt, ich bin blutiger Anfänger. Ich suche nach Scriptschnipseln die passen könnten und versuche dann, sie in meine Seite einzubauen.
Gut. Und warum versuchst du dann die komplizierteste Variante?
Struppi.
Bitte lass' nur die Texteile stehen auf die du Antwortest, Danke.
Struppi.
-
-
-
-