jquery $.ajax入门应用二

2016-02-19 16:06 2 1 收藏

生活已是百般艰难,为何不努力一点。下面图老师就给大家分享jquery $.ajax入门应用二，希望可以让热爱学习的朋友们体会到设计的小小的乐趣。

【 tulaoshi.com - Web开发】

前台
代码如下:
!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();
}

来源:https://www.tulaoshi.com/n/20160219/1611051.html

上一篇： jQuery autocomplete插件修改
下一篇： jquery的颜色选择插件实例代码

看过《jquery $.ajax入门应用二》的人还看了以下文章更多>>

使用 jQuery 简化 Ajax 开发

标签： Web开发

jQuery 是什么？ jQuery 由 John Resig 创建于 2006 年初，对于任何使用 JavaScript 代码的程序员来说，它是一个非常有用的 JavaScript 库。无论您是刚刚接触 JavaScript 语言，并且希望获得一个能解决文档对象模型（Document Object Model，DOM）脚本和 Ajax 开发中一些复杂问题的库，还是作为一个厌倦了 DOM 脚本和 Ajax 开发中无聊的...

javascript jQuery $.post $.ajax用法

标签： Web开发

jQuery.post( url, [data], [callback], [type] ) ：使用POST方式来进行异步请求参数： url (String) : 发送请求的URL地址. data (Map) : (可选) 要发送给服务器的数据，以 Key/value 的键值对形式表示。 callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。 type (String) : ...

jQuery Ajax之load()方法

标签： Web开发

load()方法是jQuery中最为简单和常用的Ajax方法，能载入远程HTML代码并插入到DOM中。它的语法结构为： load( url [, data][, callback] ) load()方法参数解释见下表：参数名称类型说明 urlString请求HTML页面的URL地址data（可选）Object发送至服务器的key/value数据callback（可选）Function请求完成时的回调函数，无论...

使用jQuery简化Ajax开发

标签： Web开发

一些简单的代码简化下面是一个简单示例，它说明了 jQuery 对代码的影响。要执行一些真正简单和常见的任务，比方说为页面的某一区域中的每个链接附加一个单击（click）事件，您可以使用纯 JavaScript 代码和 DOM 脚本来实现，如清单 1 所示。清单 1 ：没有使用 jQuery 的 DOM 脚本 var external_links = document.getElementById('exte...

jquery ajax执行后台方法

标签： Web开发

代码如下： html xmlns="http://www.w3.org/1999/xhtml" head runat="server" title/title script src="script/jquery-1.3.2.js" type="text/jscript"/script script type="text/jscript" function show(num) { var params = '{str:"'+ num+'"}'; $.ajax({ type: "POST", url: "default.aspx/aa", data: params, dataType: "text"...

查看更多精彩>>