<!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无刷新提交的更多相关文章

  1. Ajax.BeginForm()实现ajax无刷新提交

    1. 同时安装 Microsoft jQuery Unobtrusive ajax 和 jQuery Unobtrusive Ajax,如下图 安装完成之后多了如下的js库 2. 引用该js库 lay ...

  2. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

  3. Ajax无刷新提交表单和显示

    ajax无刷新表单提交:   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  4. jquey ajax 无刷新提交form

    http://bbs.csdn.net/topics/380237868 $.ajax({ type: "POST", url:ajaxCallUrl, data:$('#your ...

  5. DEDE使用AJAX无刷新提交Form表单，PHP返回结果

    $query = "INSERT INTO `{$diy->table}` (`id`, `ifcheck` $addvar)  VALUES (NULL, 0 $addvalue); ...

  6. 不使用ajax,无刷新提交表单

    <form action="form_action.asp" method="get" onsubmit"check_form()" ...

  7. DWZ框架Ajax无刷新表单提交处理流程

    DWZ框架Ajax无刷新表单提交处理流程是: 1.       ajax表单提交给服务器 2.       服务器返回一个固定格式json结构 3.       js会调函数根据这个json数据做相应 ...

  8. ajax无刷新方式收集表单并提交表单

    ajax无刷新方式收集表单有两种方式, 一个是使用html5的FormData.一个是传统的方式. 一,FormData,在主流的浏览器中可以用,IE不好用啊. 另外,FormData使用有两个条件, ...

  9. 表单 - Form - 无刷新提交原理

    为什么Form组件的表单提交可以做到无刷新? EasyUI在提交的时候,将表单作为一个隐藏的iframe进行的提交,并不是我们看到的那个表单进行的提交 并且那个iframe使用了绝对定位,保证页面上不 ...

随机推荐

  1. DataMember IsRequired属性

        1.简介 在数据契约中,如果需要序列化时,则需要传入指定IsRequired属性:   摘要: 获取或设置一个值,该值用于指示序列化引擎在读取或反序列化时成员必须存在.   public bo ...

  2. HDU4135 Co-prime（容斥原理）

    题目求[A,B]区间内与N互质数的个数. 可以通过求出区间内与N互质数的个数的前缀和,即[1,X],来得出[A,B]. 那么现在问题是求出[1,X]区间内与N互质数的个数,考虑这个问题的逆问题:[1, ...

  3. [Unity2D]鼠标（或触摸）输入处理

    在游戏的编程之中,基本上都需要依赖鼠标的输出,特别是在手机游戏上,绝大部分都需要通过手指触摸来控制游戏.如果要实现一个精灵,当手指点击精灵的会触发相关的操作,或者我们使用一张图片来作为按钮,点击的时候 ...

  4. 【TYVJ】1307 联络员（最小生成树）

    http://tyvj.cn/Problem_Show.aspx?id=1307 kruskal裸题.(水题红色警报) #include <cstdio> #include <cst ...

  5. BZOJ4143 [AMPPZ2014]The Lawyer

    Description Byteasar要制订m天的会议计划,一共有n场会议,第i场会议开始于第d[i]天的第a[i]秒,结束于第d[i]天的第b[i]秒. 对于每一天,请找出这一天的两场会议i,j, ...

  6. HttpClient_用Apache HttpClient实现URL重定向

    很多网站都使用了URL重定向技术,把一个原始请求从一个位置路由到另一个位置.原因可能是多方面的,比如域名转发.URL缩写.隐私保护.在同一网站维持相似的域名等.本文讲述怎样使用Apache HTTPC ...

  7. Html - a标签如何包裹Div

    a标签如何包裹Div? 其实应该将思路转变为将a标签作为一个遮罩来覆盖div. 做法是将a标签放置在该div下,通过将div进行相对定位[position:relative] 将a标签进行绝对定位[p ...

  8. IOS第四天(4:下一题和选框的实现)

    #import "HMViewController.h" #import "HMQuestion.h" #define kButtonWidth 35 #def ...

  9. 2016.05.04,英语,《Vocabulary Builder》Unit 22

    acerb/acri: comes from the Latin adjective acer, meaning 'sharp' or 'sour'. acerbic: [ə'sɜːrbɪk] adj ...

  10. SVN svnserve.conf: Option expected 的解决方法 以及 Authorization failed 的解决方法

    ① 在 CentOS 6.5 上安装配置了 SVN,在本地 Checkout 的时候报错: 显示:/www/svnroot/webfile/conf/svnserve.conf:12: Option ...