You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
97 lines
2.3 KiB
97 lines
2.3 KiB
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
<html>
|
|
<head>
|
|
<title>Meine ersten Ajax Erfahrungen</title>
|
|
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
|
|
|
|
<script type="text/javascript">
|
|
<!--
|
|
var req = null;
|
|
|
|
function handleTranslation ()
|
|
{
|
|
switch (req.readyState)
|
|
{
|
|
case 4:
|
|
if (req.status != 200)
|
|
alert("Fehler:"+req.status);
|
|
else
|
|
{
|
|
// felder des formulars
|
|
german_field = document.getElementById("german");
|
|
french_field = document.getElementById("french");
|
|
|
|
// antwort des servers
|
|
var translation = eval('(' + req.responseText + ')');
|
|
|
|
// schreiben des ergebnisses
|
|
german_field.value = translation.german;
|
|
french_field.value = translation.french.val1;
|
|
}
|
|
return true;
|
|
|
|
default:
|
|
return false;
|
|
}
|
|
}
|
|
|
|
function translate ()
|
|
{
|
|
// erstellen des requests
|
|
|
|
try
|
|
{
|
|
req = new XMLHttpRequest();
|
|
}
|
|
catch (e)
|
|
{
|
|
try
|
|
{
|
|
req = new ActiveXObject("Msxml2.XMLHTTP");
|
|
}
|
|
catch (e)
|
|
{
|
|
try
|
|
{
|
|
req = new ActiveXObject("Microsoft.XMLHTTP");
|
|
}
|
|
catch (failed)
|
|
{
|
|
req = null;
|
|
}
|
|
}
|
|
}
|
|
|
|
if (req == null)
|
|
alert("Error creating request object!");
|
|
|
|
// anfrage erstellen (GET, url ist localhost,
|
|
// request ist asynchron
|
|
var url = 'http://muedv031/~georg/bilder/ajax+json/ajax.php' +
|
|
'?translate=' + document.getElementById ('myword').value;
|
|
|
|
req.open("GET", url, true);
|
|
|
|
// Beim abschliessen des request wird diese Funktion ausgeführt
|
|
req.onreadystatechange = handleTranslation;
|
|
|
|
req.setRequestHeader("Content-Type",
|
|
"application/x-www-form-urlencoded");
|
|
|
|
req.send(null);
|
|
}
|
|
|
|
//-->
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="eins" style="width: 80%; height: 80%; border: dashed 1px;">
|
|
englisch: <input type="text" id="myword" onchange="translate();" />
|
|
<br />
|
|
deutsch: <input type="text" id="german" /><br />
|
|
französisch: <input type="text" id="french" /><br />
|
|
</div>
|
|
</body>
|
|
</html>
|