Archiv der Kategorie: Javascript

Javascript onEnter() – Function

Javascript, Programmieren, , , ,

Folgendes Beispiel zeigt wie eine Javascript Function zum submitten eines Forms durch Drücken der Entertaste verwendet werden kann:
onenter

Beschreibung:
Da es in Javascript keine Event-Handler für onEnter()-events gibt möchte ich hier eine einfache Möglichkeit mittels einer Javascript Function vorstellen.
Zunächst muss die Function im Header-Bereich erstellt werden, „code==13“ steht hier für das Drücken der Entertaste. „myform“ ist der Name des Forms das abgeschickt werden soll.

<script type="text/javascript">
   function onEnter(event)
   {     
      var code = 0;
      code = event.keyCode;
      if (code==13)
         document.myform.submit();
    }
</script>

Mittels folgendem Befehl kann die Funktion über ein input Feld aufgerufen werden. Sobald der Benutzer Enter drückt, wird die onEnter-Function aufgerufen und das Form abgeschickt.

<form name="myform" action="onenter.php" method="post"> 
   <input type="text" name="Inputwert" size="10" maxlength="100" onKeyPress="onEnter(event)" ></input>
</form>

Folgender Code zeigt das komplette Beispiel der onEnter Funktion in php:

<html>
  <head>
    <title>On Enter Beispiel</title>
 
    <script type="text/javascript">
	function onEnter(event)
	{     
	   var code = 0;
	   code = event.keyCode;
	   if (code==13)
	      document.myform.submit();
	}
    </script>	
  </head>
  <body>
	Welchen Wert möchstest du übergeben?? 
	<form name="myform" action="onenter.php" method="post"> 
		<input type="text" name="Inputwert" size="10" maxlength="100" onKeyPress="onEnter(event)" ></input>
	</form>
 
	(drücke enter)
	<br/>
	<br/>
	Du hast folgenden Wert übergeben: <?php echo $_POST["Inputwert"];?>
  </body>
</html>