2011年7月3日 星期日

XMLHttpRequest -- "Ajax on Java" of O'Reilly

Refer to "Ajax on Java" of O'Reilly, example 2-1, index.html.

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script languge="JavaScript" src="ajax.js"></script>
...
</head>
<body onload="focusIn()">
...
<input type="text" id="key" name="key" onkeyup="converToDecimal();">
...
<input type="text" id="keypressed" readonly>
...
<input type="text" id="decimal" readonly>
...
</body>
</html>


Refer to "Ajax on Java" of O'Reilly, example 2-2, ajax.js.

var req;


function convertToDecimal() {
var key = document.getElementById("key");
var keypressed = document.getElementById("keypressed");
var url = "/ajaxdecimalcodeconverter/response.php?key=" + escape(key.value);
if( window.XMLHttpRequest ) {
req = new XMLHttpRequest(); //for Mozilla, Firefox, Safari
}
else if( window.ActiveXObject ) {
req = new ActiveXObject("Microsoft.XMLHTTP"); //for IE
}
req.open("Get",url,true);
req.onreadystatechange = callback;
req.send(null);
}


function callback() {
if( req.readyState==4 ) {
if( req.status==200 ) {
var decimal = document.getElementById("decimal");
decimal.value= req.responseText;
}
}
clear();
}


function clear() {
var key = document.getElementById("key");
key.value = "";
}


function focusIn() {
document.getElementById("key").focus();
}

0 個意見:

張貼留言

訂閱 張貼留言 [Atom]

<< 首頁