XMLHttpRequest
代码如下 |
复制代码 |
<script type=”text/javascript”>
function loadXMLDoc()
{
var xmlhttp;
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 (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById(“txtHint”).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open(“GET”,”filefunction.php?dt=attatchment&u=abc.txt”,true);
xmlhttp.send();
}
</script>
|
下面来看看jquery+ajax/" target="_blank">jquery ajax应用
jQuery Ajax 事件
Ajax请求会产生若干不同的事件,我们可以订阅这些事件并在其中处理我们的逻辑。在jQuery这里有两种Ajax事件:局部事件 和 全局事件。
局部事件就是在每次的Ajax请求时在方法内定义的,例如:
代码如下 |
复制代码 |
$.ajax({
beforeSend: function(){
// Handle the beforeSend event
},
complete: function(){
// Handle the complete event
}
// ...
});
|
同时我们还可以直接使用如
jQuery.get( url, [data], [callback] ):使用GET方式来进行异步请求
load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中
jQuery.post( url, [data], [callback], [type] ) :使用POST方式来进行异步请求
这些都很不错,只适合小量input如果有大量的我们必须使用ajax - serialize() 方法方法了,如下
代码如下 |
复制代码 |
html
<form method="post" id="submitform" name="submitform" ><tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="6%">手机:</td>
<td width="21%"><input name="mo" type="text" class="inp" id="mo" size="17" /></td>
<td width="8%" align="right">邮箱:</td>
<td width="21%"><input name="email" type="text" class="inp" id="email" size="17" /></td>
<td width="44%"><span class="gray"></span></td>
</tr>
</table></td>
</tr>
<tr>
<td height="90" align="left">
<textarea name="bak" cols="80" rows="5" class="lab" id="bak1"></textarea></td>
</tr>
<tr>
<td><input name="button" type="button" class="but" id="buttonajax" value="提交留言" />
<span class="gray"> </span></td>
</tr>
</form>
$('#buttonajax').click(function(){
//alert($(this).val());
//checkem();
var postData = $('#submitform').serialize();
//alert(postData);
$.ajax({
type: "POST",
url: "/postajax.php",
data: postData,
success: function(msg){
//alert(msg);
if(msg==1){
alert('您的问题已提交成功!');
}
}
});
})
|
|