Problem mit onchange Listener

Neili · 24. Juli 2007

Hallo Leute!

Hab ein Problem das ich leider nicht lösen kann!
Beim Auswählen einer Option in der Auswahlliste wird die Funktion extendMenue() zwar ausgeführt jedoch kommt in der JavaScript Fehler Konsole im Firefox das Problem f has no properties!

Danke!

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Presse</title>
<style type="text/css">
.style1 {
	margin-left: 11px;
}
.style2 {
	margin-left: 29px;
}
.style3 {
	margin-left: 15px;
}
.style4 {
	margin-left: 52px;
}
.style5 {
	margin-left: 32px;
}
</style>
<script type="text/javascript" src="laufdata.js"></script>
<link rel="stylesheet" title="CSS" type="text/css" href="../styles/style1.css" media="screen" />
<script type="text/javascript">
var f=document.forms[0];

function isAPLZ(n) {
   var s = "" + n;
   var ziffern = "0123456789";
   if (s.charAt(0) == "-") {
      s = s.substring(1, s.length);
   }
   if (s=="0") {
      return true;
   }
   if (s.charAt(0) == "0") {
      return false;
   }
   for (var i=0; i<s.length; i++) {
      if (ziffern.indexOf(s.charAt(i)) == -1) {
         return false;
      }
   }
   return true;
}

function isValidEmail(mail) {
   var klammeraffe = mail.indexOf("@");
   if (klammeraffe < 1) {
      return false;
   } else {
      var punkt = mail.substring(klammeraffe).indexOf(".");
      if (punkt < 2) {
         return false;
      } else {
         return true;
      }
   }
}

function extendMenue() {
	
	if (f.sportu.selectedIndex==1)
	{
		alert("test");
	}
}

function pruefen() {
   var f = document.forms[0];
   
   while (f.nachnametext.value == "") {
      var nachname = prompt("Bitte geben Sie Ihren Nachnamen ein!");
      if (nachname) {
         f.nachnametext.value = nachname;
      }
   }
   while (f.vornametext.value == "") {
      var vorname = prompt("Bitte geben Sie Ihren Vornamen ein!");
      if (vorname!="") {
         f.vornametext.value = vorname;
      }
   }
   while (f.gebtext.value == "") {
      var geb = prompt("Bitte geben Sie Ihr Geburtsdatum ein!");
      if (geb) {
         f.gebtext.value = geb;
      }
   }
   while (f.streettext.value == "") {
      var street = prompt("Bitte geben Sie Ihre Straße ein!");
      if (street) {
         f.streettext.value = street;
      }
   }
   while (f.plztext.value == "") {
      var plz = prompt("Bitte geben Sie Ihre Postleitzahl ein!");
      if (plz && plz.length==4 && isAPLZ(plz)) {
         f.plztext.value = plz;
      }
   }
   while (f.orttext.value == "") {
      var ort = prompt("Bitte geben Sie Ihren Wohnort ein!");
      if (ort) {
         f.orttext.value = ort;
      }
   }
   while (f.emailtext.value == "") {
      var email = prompt("Bitte geben Sie Ihre E-Mail-Adresse ein!");
      if (email) {
	  	if(isValidEmail(email)) {
         	f.emailtext.value = email;
		}
      }
   }
   
   /*var it = document.getElementsByTagName("form")[0];
   
   var sel = document.createElement("select");
   sel.setAttribute("name","lauf");
   
   it.appendChild(sel);*/
   
   return true;
}
</script>
</head>
<body>

<!-- Begin Container -->
<div id="container">
	<!-- Begin Masthead -->
	<div id="masthead">
		<img src="../images/logo.gif" alt="Ihr Firmenlogo" height="66" width="150" /><p>
		Büro (000) 000-0000<br />
		Fax (000) 000-0000<br />
		gebührenfrei (000) 000-0000</p>
	</div>
	<!-- End Masthead -->
	<!-- Begin Navigation -->
	<div id="navigation">
		<ul>
			<li><a href="../default.htm">Privat</a></li>
			<li><a href="../about/about.htm">Über</a></li>
			<li><a href="../news/news.htm">Nachrichten</a></li>
			<li><a href="../products/products.htm">Produkte</a></li>
			<li><a href="../services/services.htm">Dienste</a></li>
			<li><a href="../calendar/calendar.htm">Kalender</a></li>
			<li><a href="../contact/contact.htm">Kontakt</a></li>
		</ul>
	</div>
	<!-- End Navigation -->
	<!-- Begin Page Content -->
	<div id="page_content">
		<!-- Begin Left Column -->
		<div id="column_l">
			<h2>Presse</h2>
			<p>
			<form method="post" name="data">
           	  <fieldset id="firstfieldset">
           	  <legend>Personendaten</legend>
				
				<label id="nachname"><strong>Nachname:</strong></label>
				<input name="nachnametext" onmouseover="window.status='Bitte geben Sie hier Ihren Nachnamen ein!';return true;" 					onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 142px" />
				<label id="vorname"><strong><br />
				<br />
				Vorname:</strong></label>
				<input name="vornametext" onmouseover="window.status='Bitte geben Sie hier Ihren Vornamen ein!';return true;" onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 142px" class="style1" />
                <label id="geb"><strong><br />
				<br />
			    Geburtsdatum:</strong></label>
      		    <input name="gebtext" onmouseover="window.status='Bitte geben Sie hier Ihr Geburtsdatum ein!';return true;" onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 142px" class="style1" />
				<label id="street"><strong><br />
				<br />
				Straße:</strong></label>
				<input name="streettext" onmouseover="window.status='Bitte geben Sie hier Ihre Anschrift ein!';return true;" onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 142px" class="style2" />
				<label id="plz"><strong><br />
				<br />
				PLZ:</strong></label>
				<input name="plztext" onmouseover="window.status='Bitte geben Sie hier Ihre Postleitzahl ein!';return true;" onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 88px" class="style4" />
				<label id="ort"><strong><br />
				<br />
				Wohnort:</strong></label>
				<input name="orttext" onmouseover="window.status='Bitte geben Sie hier Ihren Wohnort ein!';return true;" onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 142px" class="style3" />
				<label id="email"><strong><br />
				<br />
				E-Mail:</strong></label>
				<input name="emailtext" onmouseover="window.status='Bitte geben Sie hier Ihre E-Mail Adresse ein!';return true;" onmouseout="window.status='';return true;" type="text" style="height: 14px; width: 142px" class="style5" /><br />
			 
              </fieldset>
              
              <fieldset id="secondfieldset">
              <legend>Sportunion</legend>
              <label id="sportunion"><strong>
			  Sind Sie Mitglied der Sportunion?</strong></label>
              <select name="sportu" onchange="extendMenue();">
				<option value="Nein">Nein</option>
				<option value="Ja">Ja</option>
			  </select>
              </fieldset>
                <br />
				<input name="proof" type="button" onclick="pruefen();" value="Weiter zur Anmeldung" />
                <br />
                <br />
              
		  </form>

			</p>
			</div>
		<!-- End Left Column -->
		<!-- End Right Column --->
		<div id="column_r">
			<h4>Ressourcenübersicht</h4>
			<ul>
				<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
				<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
				<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
				<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
			</ul>
			</div>
		<!-- End Right Column --></div>
	<!-- End Page Content -->
	<!-- Begin Footer -->
	<div id="footer">
		<p><a href="../default.htm">Privat</a> | <a href="../about/about.htm">Über</a> 
		| <a href="../calendar/calendar.htm">Kalender</a> |
		<a href="../contact/contact.htm">Kontakt</a> |
		<a href="../employees/employees.htm">Mitarbeiter</a> |
		<a href="../employment/employment.htm">Beschäftigung</a> |
		<a href="../faq/faq.htm">FAQ</a> |
		<a href="../information_links/information_links.htm">Informationshyperlinks</a> 
		| <a href="../news/news.htm">Nachrichten</a> |
		<a href="../photo_gallery/photo_gallery.htm">Fotosammlung</a> |
		<a href="press.htm">Presse</a> | <a href="../products/products.htm">Produkte</a> 
		| <a href="../promotions/promotions.htm">Promotion</a> |
		<a href="../services/services.htm">Dienste</a> |
		<a href="../site_map/site_map.htm">Sitemap</a></p>
		<p>Copyright © 0000 Firmenname. Alle Rechte vorbehalten.</p>
	</div>
	<!-- End Footer --></div>
<!-- End Container -->

</body>

</html>

C-H · 24. Juli 2007

Hallo!

Vlt. bin ich blind, aber ich finde kein Objekt mit dem Namen "f". Das soll doch sicher der Name der Form sein, also "data".

Neili · 24. Juli 2007

deepthroat · 24. Juli 2007

Hi.

Auf die Elemente einer Form kann man mit der elements Eigenschaft zugreifen:

Javascript:

var f = document.forms[0];

if (f.elements["nachnametext"].value == "xyz") {
}

// oder:

if (f.elements.nachnametext.value == "abc") {
}

Gruß

Problem mit onchange Listener

Neili

Grünschnabel

C-H

Erfahrenes Mitglied

Neili

Grünschnabel

deepthroat

Erfahrenes Mitglied

Neue Beiträge