<!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. BZOJ4348 : [POI2016]Park wodny

    首先特判全部都是A或者全部都是B或者$n=1$的情况. 然后把矩阵四周都填充上A,枚举一个块,分以下情况讨论: 1.在它四周选两个块扩展,此时平方暴力枚举即可. 2.在它四周选定一个方向扩展两步. 3 ...

  2. TYVJ P1081 最近距离 Label:这不是分治！！！

    描述    在一块地上,有着n(1<=n<=2000) 头牛,输入n,再分别输入这n头牛的坐标(x,y) (1<=x<=100000,1<=y<=100000),如 ...

  3. asp.net 微信企业号办公系统-流程设计--流转条件设置（路由）

    当一个步骤后面有多个步骤时,可以设置为根据设置条件系统自动判断该流向哪些步骤,也叫路由. 工作流没有单独的路由步骤来设置条件,流程条件通过双击连线弹出条件设置框来设置. 1.sql条件 即通过sql条 ...

  4. java编译自动化

    java编译自动化 http://h2ofly.blog.51cto.com/6834926/1545452?utm_source=tuicool&utm_medium=referral

  5. 记在thinkPHP中一个创建模型的小错误

    在创建好模型以后,访问说没有该方法,如图 看代码 class ManagerModel { //put your code here function checkDenglu($name,$pwd){ ...

  6. 中科大各Linux发行版的更新源列表

    sudo vi /etc/apt/sources.list Raspberry Pi deb http://mirrors.ustc.edu.cn/raspbian/raspbian/ jessie ...

  7. 【液晶模块系列基础视频】2.虚拟U盘

    [液晶模块系列基础视频]2.虚拟U盘 ============================== 技术论坛:http://www.eeschool.org 博客地址:http://xiaomagee ...

  8. 修改ssh服务端口

    第一种: 01假如要改Linux SSH的默认端口(22),那么你只要修改:/etc/ssh/sshd_config中Port 22,这里把22改成自己要设的端口就行了,不过千万别设和现已有的端口相同 ...

  9. iOS 键盘的隐藏

     在 iOS开发中 最常用的 一些控件,如TextFiled 和 TextView,点击时会自动弹出键盘,但是隐藏操作需要我们自己来编码完成. 最常用的一种方法是,让TextFiled 和 TextV ...

  10. Bungie Interview with Halo3 Developer

    http://www.realtimerendering.com/blog/tag/bungie/ Digital Foundry interview with Halo: Reach develop ...