此案例功能实现了一边看视频一边进行加法运算，而加法运算时页面不会刷新请求
ajax代码:
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function () {
$("#btnOK").click(function () {
var i1 = $("#i1").val();
var i2 = $("#i2").val();
var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xhr.open("POST", "AjaxTest1.ashx?i1=" + i1 + "&i2=" + i2, true);
//只有监听onreadystatechange事件来获取返回的进度
xhr.onreadystatechange = function () {
if (xhr.readyState == 4)
{
//alert();
if (xhr.status == 200) {
$("#result").text(xhr.responseText);//responseText服务器返回的报文正文
}
else {
alert("服务器出错"+xhr.status);
}
}
}
xhr.send();
});
});
</script>
html代码:
<video controls="controls">
<source src="1.MP4" type="video/mp4" />
</video>
<input type="text" id="i1" value="" />+<input type="text" id="i2" value="" />
<input type="button" id="btnOK" value="=" /><span id="result"></span>
ashx代码:
context.Response.ContentType = "text/html";
int i1 = Convert.ToInt32(context.Request["i1"]);
int i2 = Convert.ToInt32(context.Request["i2"]);
int count = i1 + i2;
Thread.Sleep();
context.Response.Write(count);
调用封装的ajax函数写法：
$(function () {
$("#btnOK").click(function () {
var i1 = $("#i1").val();
var i2 = $("#i2").val();
MyAjax("AddTest1.ashx?i1=" + i1 + "&i2=" + i2,
function (resTxt) {
$("#result").text(resTxt);
},
function (status) {
$("#result").text(status);
});
});
});