jQuery入門[5]－AJAX
阿新 • • 發佈：2019-02-10
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>ajax</title><script src="../scripts/jquery-1.2.3.intellisense.js" type="text/javascript"></script><script
$(function(){
//設定指示器 $('#divIndicator').ajaxStart(function(){$(this).show()})
.ajaxSuccess(function(){$(this).hide()})
.ajaxError(function(msg){$(this).hide();alert(msg);});
//ajax get 請求
var number = $('#txtNumber').val();
$.get('CubeHandler.ashx?number='+number,function(result){
alert(result);
});
});
//ajax post 提交 $('#btnGetCubeInPost
var number = $('#txtNumber').val();
$.get('CubeHandler.ashx',{'number':number},function(result){
alert(result);
});
});
});
</script><style type="text/css">
.indicator
{
color: #FF0000;
position: absolute;
top: 0px;
right: 0px;
display: none;}</style></head><body><div id="divIndicator" class="indicator"><img src="indicator.gif"/>loading
</div>
plz input a number:<input id="txtNumber"/><input type="button" id="btnGetCubeInGet" value="Get cube(get)"/><input type="button" id="btnGetCubeInPost" value="Get cube(post)"/></body></html>
$(function(){
//設定指示器 $('#divIndicator').ajaxStart(function(){$(this).show()})
.ajaxSuccess(function(){$(this).hide()})
.ajaxError(function(msg){$(this).hide();alert(msg);});
//ajax get 請求
var number = $('#txtNumber').val();
$.get('CubeHandler.ashx?number='+number,function(result){
alert(result);
});
});
//ajax post 提交 $('#btnGetCubeInPost
var number = $('#txtNumber').val();
$.get('CubeHandler.ashx',{'number':number},function(result){
alert(result);
});
});
});
</script><style type="text/css">
.indicator
{
color: #FF0000;
position: absolute;
top: 0px;
right: 0px;
display: none;}</style></head><body><div id="divIndicator" class="indicator"><img src="indicator.gif"/>loading
</div>plz input a number:<input id="txtNumber"/><input type="button" id="btnGetCubeInGet" value="Get cube(get)"/><input type="button" id="btnGetCubeInPost" value="Get cube(post)"/></body></html>