利用XMLHTTP无刷新添加数据

2016-02-20 00:36 3 1 收藏

下面图老师小编跟大家分享利用XMLHTTP无刷新添加数据,一起来学习下过程究竟如何进行吧!喜欢就赶紧收藏起来哦~

【 tulaoshi.com - Web开发 】

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)利用XMLHTTP无刷新添加数据之Get篇.

我们传统的提交数据的方法都是用Form来实现的.
Form标记中的Method属性确定了表单元素的数据在发送到服务器时,
如何对HTTP请求信息进行打包.

Method 属性可以使用的方法
Method属性 发送表单元素的方式 读取数据的Request集合
Get 标识在URL的最后 QueryString
Post 在HTTP请求的主体内(HTTP请求的自由区域) Form

这篇文章用XMLHTTP来实现Form的Method=Get.
ClientGet.htm
script language="JavaScript"
function AddDataGet(sUserId,sUserName)
{
/*
*--------------- AddDataGet(sUserId,sUserName) -----------------
* AddDataGet(sUserId,sUserName)
* 功能:通过XMLHTTP添加数据.相当于Form的Method=Get.
* 参数:sUserId,字符串,发送条件.
* 参数:sUserName,字符串,发送条件.
* 实例:AddDataGet(document.all.userid.value,document.all.username.value);
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-30 14:46
*--------------- AddDataGet(sUserId,sUserName) -----------------
*/
var oBao = new ActiveXObject("Microsoft.XMLHTTP");
//特殊字符:+,%,&,=,?等的传输解决办法.用escape编码.
//Update:2004-6-1 12:22
//escape(sUserId),escape(sUserName);
oBao.open("POST","Server.asp?userid="+escape(sUserId)+"&username="+escape(sUserName),false);
oBao.send();
//清空输入框数据.
document.all.userid.value="";
document.all.username.value="";
//服务器端处理返回的是经过escape编码的字符串.
alert(unescape(oBao.responseText))
}
/script
input type="button" onclick="AddDataGet(document.all.userid.value,document.all.username.value)" value="AddDataGet"br
userid:input type="text" name="userid"br
username:input type="text" name="username"

Server.asp 服务器端处理.
% @Language="JavaScript" %
%
function OpenDB(sdbname)
{
/*
*--------------- OpenDB(sdbname) -----------------
* OpenDB(sdbname)
* 功能:打开数据库sdbname,返回conn对象.
* 参数:sdbname,字符串,数据库名称.
* 实例:var conn = OpenDB("database.mdb");
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-12 8:18
*--------------- OpenDB(sdbname) -----------------
*/
var connstr = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source="+Server.MapPath(sdbname);
var conn = Server.CreateObject("ADODB.Connection");
conn.Open(connstr);
return conn;
}
var sResult = "";
var oConn = OpenDB("data.mdb");
//相当于Form的Method=Get.
//相当于Form的Method=Get.
//特殊字符:+,%,&,=,?等的传输解决办法.客户端传输过来是经过escape编码的.
//所以服用器端应该先用unescape解码.
//Update:2004-6-1 12:22
//unescape(Request.QueryString("userid")).....
var userid = unescape(Request.QueryString("userid"));
var username = unescape(Request.QueryString("username"));
sResult = "userid:"+userid+"nusername:"+username+"n 添加成功."
var sql = "Insert into users(userid,username)Values('"+userid+"','"+username+"')";
oConn.Execute(sql);
Response.Write(escape(sResult));
%

来源:https://www.tulaoshi.com/n/20160220/1632214.html

延伸阅读
标签: Web开发
在页面上使用ActiveXObject的代价是很大的,如果我们的无刷新页面使用xmlhttp技术,我们或许需要频繁的建立xmlhttp对象,当然我们也可以使用全局变量来cache一个xmlhttp对象实例。但是这样的方法适合于同步方式xmlhttp通信,而对于异步方式xmlhttp通信将会出现问题。由于没有了进程的堵塞,用户可能再次调用同一个xmlhttp实例,如果这时前一个通...
标签: ASP
  刷新技术经历了大致几个阶段: 一、在HTML文件头里增加一个键,使该页面在设定的时间后跳转到指定的页面(包括自身); 例如: <meta http-equiv="refresh" content="30" 二、使用框架然后在JS脚本里定时刷新框架内容。 上面两种方式都会重新加载页面,即刷新,给人的感觉不是很好!于是无刷新技术出现了。 三、是对第二种方式的一...
标签: ASP
  开门见山,不离开页面就能刷新页面中的(部分)数据好处多多。主要是不需要写无聊代码维护 state。ASP.NET (以及其雏形 VI6 SOM)中的 server-side control (VI6 DTC, Script Library) 通过大量hidden input 来维护页面 state,其功力之深,非吾辈能及。所以我们要想办法不离开页面就能得到 新数据,这样生活会比较好过。 其实办法早...
如果是在Oracle10g之前,删除一个表空间中的数据文件后,其文件在数据库数据字典中会仍然存在,除非你删除表空间,否则文件信息不会清除。 但是从Oracle10gR2开始,Oracle允许我们彻底删除一个空文件,不留痕迹。 但是注意:如果你向 SYSTEM 表空间错误的添加了一个文件,那么就让它在哪里好了,不要动。 对于普通表空间,则可以...
标签: Web开发
第一段是我们的XML数据源,也就是要绑定的数据,METADATA结点相当于表名, AUTHOR、GENERATOR、PAGETYPE、ABSTRACT相当于列名,下面的Table是用来显示数据的容器。<TABLE dataSrc="#xmlData" border=1>是指定Table的数据源,<span dataFld="AUTHOR">loading...</span>绑定字段名。 --------------------------------------------------...

经验教程

942

收藏

71
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部