Ajax无刷新提交
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Ajax无刷新提交相关的知识,希望对你有一定的参考价值。
<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Ajax无刷新提交表单实例</title> <script language="javascript"> function f1() { //创建xmlHttp对象 var xmlHttp; if(window.ActiveXObject) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } //获取表单值 var username=document.form1.username.value; var password=document.form1.password.value; var email=document.form1.email.value; var datastr="username="+username+"&password="+password+"&email="+email; var url="http://localhost/test.php"; //提交数据 xmlHttp.open("POST",url,false); xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlHttp.send(datastr); document.getElementById("d1").innerHTML="表单已提交"; } </script> </head> <body> <div align="center"> 用户登录 <div id="d1"> </div> <form id="form1" name="form1" method="post" action=""> <table width="500" border="1" cellspacing="0" cellpadding="5"> <tr> <td colspan="2" align="center" bgcolor="#CCCCCC"><strong>用户登录</strong></td> </tr> <tr> <td width="101" align="right">用户名:</td> <td width="393" align="left"><label> <input type="text" name="username" /> </label></td> </tr> <tr> <td align="right">密码:</td> <td align="left"><label> <input type="text" name="password" /> </label></td> </tr> <tr> <td align="right">邮箱:</td> <td align="left"><label> <input type="text" name="email" /> </label></td> </tr> <tr> <td align="right"> </td> <td align="left"><label> <input type="button" name="Submit" onclick="f1()" value="提交" /> <input type="reset" name="Submit2" value="重置" /> </label></td> </tr> </table> </form> </div> </body> </html>
以上是关于Ajax无刷新提交的主要内容,如果未能解决你的问题,请参考以下文章
ASP.NET MVC下Ajax.BeginForm方式无刷新提交表单