用JS实现AJAX
用JS实现AJAX
准备工作:新建网站,建立两个页面,index.aspx和backstage.aspx,
在工程目录下新建一个文件夹命名和image,在这里添加一个loading.gif,模拟提交进度
一,前台页面代码:在index.aspx中编写
1,在网页要显示数据的地方,添加一个DIV.源代码如下
<div id="showtext"></div>
2, 添加脚本程序,代码如下。
function GetTextFromBack() {
document.getElementById('showtext').setAttribute("innerHTML", "<img src=\"image/loading.gif\" />载入中...");
var xmlhttp;
try {
xmlhttp = new XMLHttpRequest();
} catch (e) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if ( == xmlhttp.readyState) {
if ( == xmlhttp.status) {
var Bodys = xmlhttp.responseText;
document.getElementById('showtext').setAttribute("innerHTML", Bodys);
// parent.document.all.iframemain.style.height = window.document.body.scrollHeight;
// parent.document.all.iframemain.style.width = window.document.body.scrollWidth;
}
}
}
xmlhttp.open("post", "backstage.aspx?name=" + "zhangfei", true);
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlhttp.send("");
}
</script>
3,加入一个触发事件的按钮
<input type="button" onclick="GetTextFromBack()" style="width: 77px" />
二,后台页面,backstage.aspx
1,清除backstage.aspx中的html的内容,除一第一行的源代码,如下所示
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="backstage.aspx.cs" Inherits="backstage" %>
只保存这一行,不然的话,后面发送的时候,会把其他代码都做为字符串发送回去。
2, 进行C#源程序编辑界面backstage.aspx.cs,添写如下代码
{
string nameFormat = Request.Params["name"];
nameFormat = "你的名字是:"+nameFormat;
Response.Write(nameFormat);
}
到此就可以模拟出AJAX功能了。
可以以此程序为模板,后台拼写字符串,以实现复杂的操作。
注: 以下这条代码的意思是,是重载onreadystatechange方法,
xmlhttp.onreadystatechange = function() {
......
}
类似的可以,重写
window.onload = function()
{
parent.document.all.pzright.style.height=window.document.body.scrollHeight;
parent.document.all.pzright.style.width=window.document.body.scrollWidth;
}
可以利用原有的函数,实现在自已特定的功能。
用JS实现AJAX的更多相关文章
- Vue.js——基于$.ajax实现数据的跨域增删查改
概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...
- Jquery学习笔记 --ajax删除用户,使用了js原生ajax
主要复习了php的pdo数据库操作,和js的ajax,真麻烦,希望jquery的ajax简单点. index.php: 1 <!DOCTYPE html> 2 <html lang= ...
- 分享一个基于长连接+长轮询+原生的JS及AJAX实现的多人在线即时交流聊天室
实现网页版的在线聊天室的方法有很多,在没有来到HTML5之前,常见的有:定时轮询.长连接+长轮询.基于第三方插件(如FLASH的Socket),而如果是HTML5,则比较简单,可以直接使用WebSoc ...
- 原生js实现Ajax
一般来说,大家可能都会习惯用JQuery提供的Ajax方法,但是用原生的js怎么去实现Ajax方法呢? JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataT ...
- 浅谈JS之AJAX
0x00:什么是Ajax? Ajax是Asynchronous Javascript And Xml 的缩写(异步javascript及xml),Ajax是使用javascript在浏览器后台操作HT ...
- Atitit 发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化
Atitit 发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化 大段内容务必要替换转义换行符号1 提交务必使用utf编码,否则解码后的可能缺失,是web serv ...
- prototype.js 和 jQuery.js中 ajax 的使用
这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...
- Intercooler.js – 让 AJAX 像锚标签一样简单
使用 Intercooler,你可以添加 Ajax 到你的应用程序,而无需使用客户端模式的路由,认证,渲染,工厂或依赖注入.事实上,你不需要写任何的 JavaScript 代码.Intercooler ...
- 使用原生JS封装Ajax
使用原生 的JS封装 Ajax,实现 仿JQuery的Ajax,post,get三种异步请求方式: var MAjax = { //根据浏览器创建异步对象 createXhr: function () ...
- JS实现Ajax,Josn数据的序列化和反序列化---例: 省市区联动(包含get,post)
服务器端相应JOSN数据 用到序列化和反序列化----命名空间using System.Web.Script.Serialization; public void ProcessRequest(H ...
随机推荐
- andorid studio
http://www.cnblogs.com/smyhvae/p/4390905.html
- python手记(30)
#!/usr/bin/env python #-*- coding: utf-8 -*- import cv2 import numpy as np fn="test3.png" ...
- 大脑提取每一个体素26领域的matlab代码
%-------------- outer loop for x= 1:40 for y =1:48 for z =1:34 %----------inter loop x=20; y=30; z=1 ...
- 字符串(后缀自动机):Ahoi2013 差异
Description Input 一行,一个字符串S Output 一行,一个整数,表示所求值 Sample Input cacao Sample Output 54 HINT 2<=N< ...
- ZOJ Problem Set - 3758 素数
Singles' Day Time Limit: 2 Seconds Memory Limit: 65536 KB Singles' Day(or One's Day), an unofficial ...
- vijosP1285 佳佳的魔法药水
vijosP1285 佳佳的魔法药水 链接:https://vijos.org/p/1285 [思路] 图论思想. 很巧妙. 如A+B=C,将AB之间连边,边权为C,用以找相连物品与合成物. 用Dij ...
- 自定义UITableView的Seperator
在默认配置中 ,UITableView的Cell之间的Seperator左边总是空出一块,即使在Storyboard中设置为0 ,也没有效果 需要在代码中进行配置,在ViewController中实现 ...
- ListView的性能优化之convertView和viewHolder
转载请注明出处 最近碰到的面试题中经常会碰到问"ListView的优化"问题.所以就拿自己之前写的微博客户端的程序做下优化. 自己查了些资料,看了别人写的博客,得出结论,ListV ...
- 用Delphi直接获取bmp图片的像素
用Delphi直接获取bmp图片的像素,并存储显示出.(此像素主要用在LED上显示).希望高手能给出代码啊!! function getImagePixels(f: string): Integer; ...
- lightoj 1030 概率dp
题目链接:http://lightoj.com/volume_showproblem.php?problem=1030 #include<cstdio> #include<cstri ...