✔ Tabindex statt Tab-Taste mit Enter-Taste

T

tanjahouse

Mitglied
Hallo Guten abend ich habe einige formularfelder die ich verschieden über den Tabindex ansteuern kann.

PHP: 
 <input name="art" type="text" id="art" size="5" maxlength="5" tabindex="11"/>

Jetzt zur Frage ist es möglich auch die entertaste vom Tastaturnummernblock zum tabben zu verwenden. Also das ich statt tab mit der entertaste ins nächste feld springen kann ?

##EDIT##

hab jetzt einen enter code und zwar:

PHP: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>tanjahouse</title> 
<script type="text/javascript"> 
<!-- 
var blah=0; 
document.onkeydown=function(e){ 
txt=document.adressen; 
if(!e)e=window.event; 
code=(e.keyCode)?e.keyCode:e.which; 
el=(e.srcElement)?e.srcElement:e.target; 
if(el.tabIndex){ 
tab=Number(el.tabIndex); 
} 
if(code==13){ 
if(tab==txt.length){ 
alert('letztes textfeld'); 
} 
else{ 
for (var i=0;i<txt.length;i++){ 
if(Number(txt[i].tabIndex)==(tab+1)){ 
txt[i].focus(); 
} 
} 
} 
blah=1 
return false; 
} 
else blah=0; 
} 
//--> 
</script> 
</head> 
<body> 
<form name="adressen" action="#"> 
<input name="text1" tabindex="1"><br> 
<input name="text2" tabindex="2"><br> 
<input name="text3" tabindex="3"><br> 
<input name="text4" tabindex="4"><br> 
<input name="text5" tabindex="5"><br>
<input name="text6" tabindex="6"><br> 
</form> 
</body> 
</html>

statt der meldung letztes textfeld wollte ich auf eine andere seite springen z.b. 1.php ist sowas möglich ?
 
Wow super einwandfrei geklappt, was sehr komisch ist und zwar ich habe in meinem Formular den fokus gesetzt in einem bestimmten textfeld das funktioniert auch.

PHP: 
<body bgcolor="#eeeeff" onLoad="window.focus(); text1.focus(); text1.select()">

nur wenn ich das jetzt hier mit einbinde bekomme ich eine Fehlermeldung

PHP: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
<head>
<body bgcolor="#eeeeff" onLoad="window.focus(); text1.focus(); text1.select()">  
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">  
<title>tanjahouse</title>  
<script type="text/javascript">  
<!--  
var blah=0;  
document.onkeydown=function(e){  
txt=document.adressen;  
if(!e)e=window.event;  
code=(e.keyCode)?e.keyCode:e.which;  
el=(e.srcElement)?e.srcElement:e.target;  
if(el.tabIndex){  
tab=Number(el.tabIndex);  
}  
if(code==13){  
if(tab==txt.length){  
location.href="adressen.php";;  
}  
else{  
for (var i=0;i<txt.length;i++){  
if(Number(txt[i].tabIndex)==(tab+1)){  
txt[i].focus();  
}  
}  
}  
blah=1  
return false;  
}  
else blah=0;  
}  
//-->  
</script>  
</head>  
<body>  
<form name="adressen" action="#">  
<input name="text1" tabindex="1"><br>  
<input name="text2" tabindex="2"><br>  
<input name="text3" tabindex="3"><br>  
<input name="text4" tabindex="4"><br>  
<input name="text5" tabindex="5"><br> 
<input name="text6" tabindex="6"><br>  
</form>  
</body>  
</html>

hab auch schon versucht mit java den Focus zu setzten geht auch nicht nur mit fehlermeldung, wenn ich das enter script rausnehme funktioniert es
 
Moin,

versuch's nochmal mit nur einem Semikolon in dieser Zeile:
Code: 
location.href="adressen.php";;


mfg Maik
 
Hallo, Guten Morgen vielen Dank das mit dem umschalten auf die nächste Seite funktioniert, ich poste mal den orginal code:

PHP: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head>
<link href="adressen.css" rel="stylesheet" type="text/css" />
<title>Adressenverwaltung / Kommunikation</title>
<script type="text/javascript">  
<!--  
var blah=0;  
document.onkeydown=function(e){  
txt=document.adressen;  
if(!e)e=window.event;  
code=(e.keyCode)?e.keyCode:e.which;  
el=(e.srcElement)?e.srcElement:e.target;  
if(el.tabIndex){  
tab=Number(el.tabIndex);  
}  
if(code==13){  
if(tab==txt.length){  
location.href="adressen.php";;  
}  
else{  
for (var i=0;i<txt.length;i++){  
if(Number(txt[i].tabIndex)==(tab+1)){  
txt[i].focus();  
}  
}  
}  
blah=1  
return false;  
}  
else blah=0;  
}  
//-->  
</script>  
 <br>
 <a href="adressen.php"><img src="an.jpg" width="122" height="25" border="0"></a><a href="kommunikation.php"><img src="kom.jpg" width="120" height="25" border="0"></a></font> 
</p><fieldset>
<p>&nbsp; </p>
<table width="791" border="0">
  <tr bgcolor="#CCCCCC"> 
    <td height="18"><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font> 
    </td>
    <td height="18">&nbsp;</td>
    <td width="31" height="18">&nbsp;</td>
    <td width="127">&nbsp;</td>
    <td height="18">&nbsp;</td>
  </tr>
  <tr> 
    <td width="159" height="21" bgcolor="#CCCCCC"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif"><strong>Kommunikation</strong></font></td>
    <td width="190">&nbsp;</td>
    <td colspan="2" bgcolor="#CCCCCC"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif"><strong>Zusatzinformationen 
      </strong></font></td>
    <td width="262"><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; 
      </font></td>
  </tr>
  <tr>
  <form name="adressen" action="#">  
    <td><font size="2" face="Arial, Helvetica, sans-serif">Telefon </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="telefon" type="text" id="telefon" size="30" maxlength="30" tabindex="1">
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Sortierung</font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="sortierung" type="text" id="sortierung" size="20" maxlength="20" tabindex="8"/>
      </font></td>
    <STYLE>.mystyle2 { BACKGROUND:#cccccc;}</STYLE>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Telefax </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="telefax" type="text" id="telefax" size="30" maxlength="30" tabindex="2"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Steueridentifikation 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="steuer" type="text" id="steuer" size="20" maxlength="20" tabindex="9"/>
      </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Mobilfunk-1</font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="mobil1" type="text" id="mobil1" size="20" maxlength="20" tabindex="3"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Kundenreferenz 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="refer" type="text" id="refer" size="20" maxlength="20" tabindex="10"/>
      </font></td>
  </tr>
  <tr> 
    <td height="24"><font size="2" face="Arial, Helvetica, sans-serif">Mobilfunk-2 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="mobil2" type="text" id="mobil2" size="20" maxlength="20" tabindex="4"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Kundenart 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="art" type="text" id="art" size="5" maxlength="5" tabindex="11"/>
      </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Internet </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="internet" type="text" id="internet" size="30" maxlength="30" tabindex="5"/>
      </font></td>
    <td colspan="2"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif"><strong> 
      </strong> </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">E-Mail </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="email" type="text" id="email" size="30" maxlength="30" tabindex="6"/>
      </font></td>
    <td colspan="2">&nbsp;</td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Ansprechpartner </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="ansprechpartner" type="text" id="ansprechpartner" size="30" maxlength="30" tabindex="7"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td colspan="2">&nbsp;</td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td height="24" bgcolor="#CCCCCC"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif">Hinweistext</font></td>
    <td>&nbsp;</td>
    <td colspan="2">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="24"><font size="2" face="Arial, Helvetica, sans-serif">Code</font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="code" type="text" id="code" size="10" maxlength="10" tabindex="12"/>
      </font></td>
    <td colspan="2">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="24" colspan="5"><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="zusatztext1" type="text" id="zusatztext1" size="124" maxlength="124" tabindex="13" />
      </font></td>
  </tr>
  <tr> 
    <td height="24" colspan="5"><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="zusatztext2" type="text" id="zusatztext2" size="124" maxlength="124" tabindex="14"/>
      </font></td>
  </tr>
  <tr> 
    <td height="24" colspan="5" bgcolor="#003399"><font color="#FFFFFF" size="2" face="Arial, Helvetica, sans-serif">Eingabe 
      der Telefonnummer</font> </td>
	  </form>
  </tr><fieldset>
</table>

DAS FUNKIONIERT, aber wenn ich das mit einbaue b.z.w. den fokus auf das telefon feld setze geht nix

PHP: 
<body bgcolor="#eeeeff" onLoad="window.focus(); telefon.focus(); telefon.select()">

wie schon erwähnt wenn ich das enter javascript rausnehme setzt er den Fokus
 
Mit diesem korrigierten Code erhalte ich nicht mehr die JS-Fehlermeldung "text1 is not defined":
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>tanjahouse</title>
<script type="text/javascript">
<!--
var blah=0;
document.onkeydown=function(e){
txt=document.adressen;
if(!e)e=window.event;
code=(e.keyCode)?e.keyCode:e.which;
el=(e.srcElement)?e.srcElement:e.target;
if(el.tabIndex){
tab=Number(el.tabIndex);
}
if(code==13){
if(tab==txt.length){
location.href="adressen.php";
}
else{
for (var i=0;i<txt.length;i++){
if(Number(txt[i].tabIndex)==(tab+1)){
txt[i].focus();
}
}
}
blah=1
return false;
}
else blah=0;
}
//-->
</script>
</head>
<body bgcolor="#eeeeff" onload="window.focus(); document.adressen.text1.focus(); document.adressen.text1.select()">
<form name="adressen" action="#">
<input name="text1" tabindex="1"><br>
<input name="text2" tabindex="2"><br>
<input name="text3" tabindex="3"><br>
<input name="text4" tabindex="4"><br>
<input name="text5" tabindex="5"><br>
<input name="text6" tabindex="6"><br>
</form>
</body>
</html>


mfg Maik
 
Ah ok lags dann am:

PHP: 
; document.adressen.text1.focus(); document.adressen.text1.select()

das es nochmal mit " document.adressen " erläutert wurde?

Super Funktioniert einwandfrei, schönen lieben dank Maik!

LG Tanja
 
Lies dir hierzu mal den Abschnitt elements: Allgemeines zur Verwendung durch, wie Formularelemente mit JS angesprochen werden.

Zum zweiten hattest du den <body>-Tag mit dem onload-Event im HTML-Code an der falschen Stelle platziert, und doppelt war er darin auch enthalten.

mfg Maik
 
Ich dreh gleich durch ich hab 2 dateien bei der einen gehts die andere ist identisch und geht nicht

1ste:

PHP: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<body bgcolor="#eeeeff" onload="window.focus(); document.adressen.text1.focus(); document.adressen.text1.select()">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>tanjahouse</title>
<script type="text/javascript">
<!--
var blah=0;
document.onkeydown=function(e){
txt=document.adressen;
if(!e)e=window.event;
code=(e.keyCode)?e.keyCode:e.which;
el=(e.srcElement)?e.srcElement:e.target;
if(el.tabIndex){
tab=Number(el.tabIndex);
}
if(code==13){
if(tab==txt.length){
location.href="adressen.php";
}
else{
for (var i=0;i<txt.length;i++){
if(Number(txt[i].tabIndex)==(tab+1)){
txt[i].focus();
}
}
}
blah=1
return false;
}
else blah=0;
}
//-->
</script>
</head>
<form name="adressen" action="#">
<input name="text1" tabindex="1"><br>
<input name="text2" tabindex="2"><br>
</form>
</body>
</html>

geht wies sein soll dank Maik

die 2te

PHP: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<body bgcolor="#eeeeff" onload="window.focus(); document.kommunikation.telefon.focus(); document.kommunikation.telefon.select()">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="adressen.css" rel="stylesheet" type="text/css" />
<title>Adressenverwaltung / Kommunikation</title>
<script type="text/javascript">
<!--
var blah=0;
document.onkeydown=function(e){
txt=document.kommunikation;
if(!e)e=window.event;
code=(e.keyCode)?e.keyCode:e.which;
el=(e.srcElement)?e.srcElement:e.target;
if(el.tabIndex){
tab=Number(el.tabIndex);
}
if(code==13){
if(tab==txt.length){
location.href="adressen.php";
}
else{
for (var i=0;i<txt.length;i++){
if(Number(txt[i].tabIndex)==(tab+1)){
txt[i].focus();
}
}
}
blah=1
return false;
}
else blah=0;
}
//-->
</script>
</head>
<img src="head.jpg" width="735" height="125" /><br>
<a href="adressen.php"><img src="an.jpg" width="122" height="25" border="0"></a><a href="kommunikation.php"><img src="kom.jpg" width="120" height="25" border="0"></a></font> 
<form name="kommunikation" action="#">
</p><fieldset>
<p>&nbsp; </p>
<table width="791" border="0">
  <tr bgcolor="#CCCCCC"> 
    <td height="18"><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font> 
    </td>
    <td height="18">&nbsp;</td>
    <td width="31" height="18">&nbsp;</td>
    <td width="127">&nbsp;</td>
    <td height="18">&nbsp;</td>
  </tr>
  <tr> 
    <td width="159" height="21" bgcolor="#CCCCCC"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif"><strong>Kommunikation</strong></font></td>
    <td width="190">&nbsp;</td>
    <td colspan="2" bgcolor="#CCCCCC"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif"><strong>Zusatzinformationen 
      </strong></font></td>
    <td width="262"><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; 
      </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Telefon </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="telefon" type="text" id="telefon" size="30" maxlength="30" tabindex="1"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Sortierung</font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="sortierung" type="text" id="sortierung" size="20" maxlength="20" tabindex="8"/>
      </font></td>
    <STYLE>.mystyle2 { BACKGROUND:#cccccc;}</STYLE>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Telefax </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="telefax" type="text" id="telefax" size="30" maxlength="30" tabindex="2"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Steueridentifikation 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="steuer" type="text" id="steuer" size="20" maxlength="20" tabindex="9"/>
      </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Mobilfunk-1</font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="mobil1" type="text" id="mobil1" size="20" maxlength="20" tabindex="3"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Kundenreferenz 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="refer" type="text" id="refer" size="20" maxlength="20" tabindex="10"/>
      </font></td>
  </tr>
  <tr> 
    <td height="24"><font size="2" face="Arial, Helvetica, sans-serif">Mobilfunk-2 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="mobil2" type="text" id="mobil2" size="20" maxlength="20" tabindex="4"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">Kundenart 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="art" type="text" id="art" size="5" maxlength="5" tabindex="11"/>
      </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Internet </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="internet" type="text" id="internet" size="30" maxlength="30" tabindex="5"/>
      </font></td>
    <td colspan="2"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif"><strong> 
      </strong> </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">E-Mail </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="email" type="text" id="email" size="30" maxlength="30" tabindex="6"/>
      </font></td>
    <td colspan="2">&nbsp;</td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td><font size="2" face="Arial, Helvetica, sans-serif">Ansprechpartner </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="ansprechpartner" type="text" id="ansprechpartner" size="30" maxlength="30" tabindex="7"/>
      </font></td>
    <td colspan="2"><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; 
      </font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td colspan="2">&nbsp;</td>
    <td><font size="2" face="Arial, Helvetica, sans-serif">&nbsp; </font></td>
  </tr>
  <tr> 
    <td height="24" bgcolor="#CCCCCC"><font color="#000099" size="2" face="Arial, Helvetica, sans-serif">Hinweistext</font></td>
    <td>&nbsp;</td>
    <td colspan="2">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="24"><font size="2" face="Arial, Helvetica, sans-serif">Code</font></td>
    <td><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="code" type="text" id="code" size="10" maxlength="10" tabindex="12"/>
      </font></td>
    <td colspan="2">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr> 
    <td height="24" colspan="5"><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="zusatztext1" type="text" id="zusatztext1" size="124" maxlength="124" tabindex="13"/>
      </font></td>
  </tr>
  <tr> 
    <td height="24" colspan="5"><font size="2" face="Arial, Helvetica, sans-serif"> 
      <input name="zusatztext2" type="text" id="zusatztext2" size="124" maxlength="124" tabindex="14"/>
      </font></td>
  </tr>
  <tr> 
    <td height="24" colspan="5" bgcolor="#003399"><font color="#FFFFFF" size="2" face="Arial, Helvetica, sans-serif">Eingabe 
      der Telefonnummer</font> </td>
  </tr><fieldset>
</table>
</form>
</body>
</html>

geht nicht mit der überleitung an adressen.php also die andere seite anspringen im 1sten code funktionierts
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück