AJAX PHP无刷新form表单提交的简单实现(推荐)
ajax.php：
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>UntitledDocument</title>
</head>
<scriptlanguage="javascript">
functionsaveUserInfo()
{
//获取接受返回信息层
varmsg=document.getElementByIdx_x("msg");
//获取表单对象和用户信息值
varf=document.user_info;
varuserName=f.user_name.value;
varuserAge=f.user_age.value;
varuserSex=f.user_sex.value;
//接收表单的URL地址
varurl="./ajax_output.php";
//需要POST的值，把每个变量都通过&来联接
varpostStr="user_name="+userName+"&user_age="+userAge+"&user_sex="+userSex;
//实例化Ajax
//varajax=InitAjax();
varajax=false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest){//Mozilla浏览器
ajax=newXMLHttpRequest();
if(ajax.overrideMimeType){//设置MiME类别
ajax.overrideMimeType("text/xml");
}
}
elseif(window.ActiveXObject){//IE浏览器
try{
ajax=newActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
ajax=newActiveXObject("Microsoft.XMLHTTP");
}catch(e){}
}
}
if(!ajax){//异常，创建对象实例失败
window.alert("不能创建XMLHttpRequest对象实例.");
returnfalse;
}
//通过Post方式打开连接
ajax.open("POST",url,true);
//定义传输的文件HTTP头信息
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送POST数据
ajax.send(postStr);
//获取执行状态
ajax.onreadystatechange=function(){
//如果执行状态成功，那么就把返回信息写到指定的层里
if(ajax.readyState==4&&ajax.status==200){
msg.innerHTML=ajax.responseText;
}
}
alert(userName);
}
</script>
<body>
<divid="msg"></div>
<formname="user_info"method="post"action="">
姓名：<inputtype="text"id="user_name"name="user_name"/><br/>
年龄：<inputtype="text"name="user_age"/><br/>
性别：<inputtype="text"name="user_sex"/><br/>
<inputtype="button"value="提交表单"onClick="saveUserInfo()">
</form>
</body>
ajax_output.php：
<?php
$username=$_POST['user_name'];
$userage=$_POST['user_age'];
$usersex=$_POST['user_sex'];
echo"$username<br>";
echo"$userage<br>";
echo"$usersex<br>";
$db=newmysqli('localhost','root','123456','test');
if(!$db){
echo"连接失败！";
}
$db->query("setnamesutf8");
$query="insertintouserinfo(uname,uage,usex)values('".$username."','".$userage."','".$usersex."')";
$result=$db->query($query);
if($result){
echo"上传成功！";
}
else{
echo"失败！";
}
$db->close();
?>
以上这篇AJAXPHP无刷新form表单提交的简单实现(推荐)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。