توضیح مثال - صفحه HTML(Example Explained - The HTML Page)
هنگامی که کاربر یکی از گزینه های بالا را انتخاب می کند، تابعی به نام "getVote()" اجرا می شود. را
تابع توسط رویداد "onclick" فعال می شود:
<html>
<head>
<script>
function getVote(int)
{
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (this.readyState==4 && this.status==200) {
document.getElementById("poll").innerHTML=this.responseText;
}
}
xmlhttp.open("GET","poll_vote.php?vote="+int,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="poll">
<h3>Do you like PHP and AJAX so far?</h3>
<form>
Yes:
<input type="radio" name="vote"
value="0" onclick="getVote(this.value)">
<br>No:
<input type="radio" name="vote"
value="1" onclick="getVote(this.value)">
</form>
</div>
</body>
</html>
تابع getVote() کارهای زیر را انجام می دهد:
- یک شی XMLHttpRequest ایجاد کنید
- عملکردی را ایجاد کنید که وقتی پاسخ سرور آماده شد اجرا شود
- درخواست را به فایلی در سرور ارسال کنید
- توجه کنید که یک پارامتر (رای) به URL اضافه شده است (با مقدار گزینه بله یا خیر)