jquery $.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>
<title>无标题页</title>
<style type="text/css">
.show{ display:block;}
.hide{ display:none;}
</style>
<script type="text/javascript" src="jquery/jquery-1.2.6.js"></script>
<script type="text/javascript">
//这个方法把ajax方法封装一下，方便调用。
function myajax(){
$.ajax({
type:'get',
url:'ajax.aspx',
data:'id=1name=tree',
dataType:'html',
beforeSend:beforecall,
success:callback
});
}
//调用前方法
function beforecall(){
$('#wait').addClass("show").append('调出中...');
//alert('');//测试是否调用
}
//回调函数
function callback(data){
$('#response').append(data);
$('#wait').css("display","none");
}
//onload()事件
$(function(){
$('#confirm').click(myajax);
})
</script>
</head>
<body>
<div id="confirm">点击</div>
<div id="response">接收后台数据</div>
<div id="wait" class="hide">hello</div>
</body>
</html>

后台


代码如下:

protected void Page_Load(object sender, EventArgs e)
{
Response.Write("hello"+Request["name"]);
Response.End();
}

赞 (0)

相关推荐

  • jquery $.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> <title>无标题页&l

  • Bootstrap零基础入门教程(二)

    Bootstrap零基础入门教程(二)

    什么是 Bootstrap? Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的. 历史 Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的.Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品. 本文重点给大家介绍Bootstrap零基础入门教程(二),具体详情如下所示: 过程中会频繁查阅资料的网站: http://www.

  • Ajax 入门之 GET 与 POST 的不同处详解

    Ajax 入门之 GET 与 POST 的不同处详解

    在之前的随笔中,本着怀旧的态度总结了一篇 兼容不同浏览器 建立XHR对象的方法: 在建立好XHR对象之后,客户端需要做的就是,将数据以某种方式传递到服务器,以获得相应的响应,在这里,  Ajax技术总结的第二季,我将重点阐述 提交数据的两种方式. 在这之前需要了解一下我们的HTTP传输协议: HTTP 的工作方式是客户机与服务器之间的请求-应答协议. 举例:客户端(浏览器)向服务器提交 HTTP 请求:服务器向客户端返回响应.响应包含关于请求的状态信息以及可能被请求的内容.而想要基于HTTP协议

  • MongoDB快速入门笔记(二)之MongoDB的概念及简单操作

    MongoDB快速入门笔记(二)之MongoDB的概念及简单操作

    MongoDB是面向集合的文档式数据库,不像关系数据库那样,有表,列.行,mongoDB数据库则是由一系列的文档组成.下面给大家介绍MongoDB的概念及简单操作. 1.以下列举普通的关系型数据库和MongoDB数据库简单概念上的区别: 2.MongoDB的简单操作 (1)启动MongoDB数据库之后,使用命令mongo,显示如下,默认连接到test数据库. MongoDB shell version: 3.2.6 connecting to: test 使用命令show dbs,可以查看所有的

  • 零基础易语言入门教程(二)之编程思路

    零基础易语言入门教程(二)之编程思路

    易语言简介: 易语言是一门以中文作为程序代码编程语言.以"易"著称.创始人为吴涛.早期版本的名字为E语言.易语言最早的版本的发布可追溯至2000年9月11日.创造易语言的初衷是进行用中文来编写程序的实践.从2000年至今,易语言已经发展到一定的规模,功能上.用户数量上都十分可观. 上一篇跟大家讲了零基础易语言入门教程(一)编写第一个程序,然后接下来大家应该自己把支持库和易语言组件里面的控件全部认真的看一下,下面我直接跟大家分享下易语言简单编程思路. 方法和步骤如下所示: 1.易语言程序

  • Ajax入门学习教程（一）

    Ajax入门学习教程（一）

    1 什么是AJAX AJAX(Asynchronous JavaScript And XML)翻译成中文就是"异步Javascript和XML".即使用Javascript语言与服务器进行异步交互,传输的数据为XML(当然,传输的数据不只是XML). AJAX还有一个最大的特点就是,当服务器响应时,不用刷新整个浏览器页面,而是可以局部刷新.这一特点给用户的感受是在不知不觉中完成请求和响应过程. 与服务器异步交互: 浏览器页面局部刷新: 2. 同步交互与异步交互 同步交互:客户端发出一个

  • BootStrap入门教程(二)之固定的内置样式

    BootStrap入门教程(二)之固定的内置样式

    相关阅读: BootStrap入门教程(一)之可视化布局 HTML5文档类型(Doctype) Bootstrap使用了一些HTML5元素和CSS属性,所以需要使用HTML5文档类型. <!DOCTYPE html> <html> .... </html> 移动设备优先 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 宽度设置

  • Python入门教程(二十九)Python的RegEx正则表达式

    RegEx 或正则表达式是形成搜索模式的字符序列. RegEx 可用于检查字符串是否包含指定的搜索模式. RegEx 模块 Python 提供名为 re 的内置包,可用于处理正则表达式. 导入 re 模块: import re Python 中的 RegEx 导入 re 模块后,就可以开始使用正则表达式了: 实例 检索字符串以查看它是否以 “China” 开头并以 “country” 结尾: import re txt = "China is a great country" x =

  • Python入门教程(二十八)Python中的JSON

    JSON 是用于存储和交换数据的语法. JSON 是用 JavaScript 对象表示法(JavaScript object notation)编写的文本. Python 中的 JSON Python 有一个名为 json 的内置包,可用于处理 JSON 数据. 实例 导入 json 模块: import json 解析 JSON - 把 JSON 转换为 Python 若有 JSON 字符串,则可以使用 json.loads() 方法对其进行解析. 结果将是 Python 字典 实例 把 JS

  • Python入门教程(二十七)Python的日期

    目录 Python 日期 日期输出 创建日期对象 strftime() 方法 Python 日期 Python 中的日期不是其自身的数据类型,但是我们可以导入名为 datetime 的模块,把日期视作日期对象进行处理. 实例 导入 datetime 模块并显示当前日期: import datetime x = datetime.datetime.now() print(x) 运行实例 2023-02-14 20:43:20.889388 日期输出 如果我们执行上面的代码,结果将是: 2019-0

随机推荐