how to convert ajax javascript to ajax jQuery
<div dir="ltr">hi,
i send my full code for you reference tell how convert
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="md5.js" type="text/javascript"></script>// this script used in encoding format
<title>Captcha Using API Function</title>
<script src="md5.js" type="text/javascript"></script>
<script type="text/javascript">
var XMLHttpArray = [
function() {return new XMLHttpRequest()},
function() {return new ActiveXObject("Msxml2.XMLHTTP")},
function() {return new ActiveXObject("Msxml2.XMLHTTP")},
function() {return new ActiveXObject("Microsoft.XMLHTTP")}
];
function createXMLHTTPObject(){
var xmlhttp = false;
for(var i=0; i<XMLHttpArray.length; i++){
try{
xmlhttp = XMLHttpArray[i]();
}catch(e){
continue;
}
break;
}
return xmlhttp;
}
function AjaxRequest(url,method){
var req = createXMLHTTPObject();
req.onreadystatechange= function(){
if (req.readyState == 4){
if (req.status == 200){
var resarray = req.responseText.split("<#>");
document.getElementById('question').innerHTML= resarray[0];
document.getElementById('ans1').value = resarray[1];
document.getElementById('ans2').value = resarray[2];
}
else if (req.status == 404){
alert("Request URL does not exist");
}
else {
alert("Error: status code is " + req.status);
}
}
}
req.open(method,url,true);
//req.setRequestHeader('User-Agent', 'My XMLHTTP Agent');
req.setRequestHeader("Content-Type", "text/html");
req.send(null);
}
function AjaxResponse(req){
var respXML=req.responseXML;
if(!respXML) return;
var respVAL=respXML.getElementsByTagName('family')[0]
.getAttribute('result');
document.getElementById("status").innerHTML += respVAL;
}
function ClearResponse(){
mdiv=document.getElementById("status");
mdiv.innerHTML = "";
}
function MakeRequest(){
AjaxRequest(action="fn.php?id=1",method="get");
}
function handleKeyPress(e){
var key=e.keyCode || e.which;
if (key==13){
check();
//form.submit();
//return false;
}
}
function check()
{
var chk = document.getElementById('hash').value ;
alert(chk);
var chk1 = document.getElementById('ans1').value;
var chk2 =document.getElementById('ans2').value;
if((chk == chk1) || (chk == chk2))
{
alert("success");
return;
}
else
{
alert("failure");
document.getElementById('question').innerHTML= '';
document.getElementById('ans1').value = '';
document.getElementById('ans2').value = '';
MakeRequest();
}
}
</script>
</head>
<body onload = "MakeRequest();">
<form name="fcap"
id="signup" action="post" onsubmit="return false;">
<div id="question"></div>
<input type="text"
name="capt"
id="capt"
size="40"
maxlength="100"
onkeyup="alert(hex_md5(this.form.capt.value))" onkeypress="return handleKeyPress(event);"/>
<input name="ans1" id="ans1" type="hidden" value="">
<input name="ans2" id="ans2" type="hidden" value="">
<input name="hash" id="hash" type="hidden" value="">
<input type="button"
onClick="check();" value="submit" >
</form>
</body>
</html>
fn.php
<?php
if($_GET['id'] == 1) {
/* load captcha using web service */
$url = '<a href="http://textcaptcha.com">http://textcaptcha.com</a>';
$xml = new SimpleXMLElement($url,null,true);
/* display question as part of form */
$question = (string) $xml->question;
/* ... [snip] ... */
/* store answers in session */
$ans = array();
foreach ($xml->answer as $hash) {
$ans[] = $hash;
}
$_SESSION['captcha'] = $ans;
list ($ans1, $ans2) = $ans;
echo $question."<#>".$ans1."<#>".$ans2;
}
?>
now i click on submit button it passed check function answer is right means the page not reload , it is wrong the page is reload.
tell
bye
</div>