✔ jQuery & AJAX - einfache Input-Abfrage

D

dev-c

Mitglied
Hallo!

Ich wollte mir mit jQuery & AJAX eine einfache Input-Abfrage erstellen. Ich gib einen Namen an und kann mir den dann anzeigen lassen. Bis jetzt habe ich es so gemacht, dass ein Text durch einen anderen Text ersetzt wird. Wie kann ich das aber mit einer Variablen machen?

Code: 
<!DOCTYPE html>
<head>
	<meta charset="utf-8">
	<title>AJAX</title>
	<style type="text/css">
		body {
			margin: 20px;
			background-color: #222;
		}
		h1 {
			font-family: sans-serif;
			color: #FFF;
			margin: 0;
		}
	</style>
	
	<script src="http://code.jquery.com/jquery-latest.js"></script>

	<script>
		function get_content()
		{
			$('#test').html('Neuer Text');
		}
		
		function get_name(name)
		{
			$('#nam').html('Name');
		}
	</script>
	
</head>
<body>

	<h1>AJAX</h1>
	
	<br/>
	<br/>
	
	<button onclick="get_content()">button</button>
	<div id="test">Hallo</div>
	
	<br/>
	<br/>
	
	Eingabe: <input type ="text" name="name"><br/>
	<button onclick="get_name()">show</button><br/>
	Name: <span id="nam"></span>
	
</body>
</html>

thx
 
Hi,

du kannst über die Methode val auf den Inhalt von Textfeldern zugreifen. Wie du das jeweilige input-Element selektierst, bleibt dir überlassen. Im folgenden Beispiel wurde das Feld mit einer ID versehen:
Code: 
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>AJAX</title>
<style type="text/css">
  body {
    margin: 20px;
    background-color: #222;
  }
  h1 {
    font-family: sans-serif;
    color: #FFF;
    margin: 0;
  }
  span{
    color: #fff;
  }
</style>

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script>
  function get_name(inputID){
    $('#nam').html($('#' + inputID).val());
  }
</script>
</head>
<body>
	Eingabe: <input type="text" name="name" id="inputID"><br/>
	<button onclick="get_name('inputID')">show</button><br/>
	Name: <span id="nam"></span>
</body>
</html>
Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück