十分钟学会JQ.doc

上传人:hs****ma 文档编号:543237046 上传时间:2023-12-02 格式:DOC 页数:7 大小:347.50KB
返回 下载 相关 举报
十分钟学会JQ.doc_第1页
第1页 / 共7页
十分钟学会JQ.doc_第2页
第2页 / 共7页
十分钟学会JQ.doc_第3页
第3页 / 共7页
十分钟学会JQ.doc_第4页
第4页 / 共7页
十分钟学会JQ.doc_第5页
第5页 / 共7页
点击查看更多>>
资源描述

《十分钟学会JQ.doc》由会员分享,可在线阅读,更多相关《十分钟学会JQ.doc(7页珍藏版)》请在金锄头文库上搜索。

1、本文介绍如何在ASP.NET(ASP.NET/AJAX)里使用基于JQuery的AJAX技术。(源代码下载见最后)在使用JQuery前,请到下载最新版本的js代码,然后再代码里使用即可,当然,由于微软已经把JQuery集成到VS里,所以你可以到WWW.ASP.NET/ajax查看本文将通过六个列子介绍如何在ASP.NET里使用JQuery,其他很容易类比学会。这个项目布局如下图Sample1:JQuery支持基于Get的AJAX本例子说明如何在ASP.NET里使用基于JQuery的Get方法。页面布局代码如下:页面布局很简单,一个文本框用于输入票数,还有一个ID为Error1的div,用于显示

2、AJAX操作结果。下面是AJAX的方法在了解代码前,看一下运行结果:运行效果在票数后面输入数字,如果大于5,则给出提示信息,否则,则没有。 这里使用了文本框的change事件,所以输入数字后,需要使其失去焦点,否则看不到结果下面是对上面代码的简单解释:$(document).ready(function().是一个类似英语用法的标准句型,当页面完毕后做某事的意思。可能有人需要问为什么需要需要这样的类型。这是因为JS的位置不同,需要执行不同的判断。考虑一下到你打开的百度页面,当百度页面加载完毕后,光标会自动定位到输入框这里它的代码可能类似如下:varo=document.getElemement

3、ById(f);o.focus();在这里,这段脚本必须放在后面,如果这样放置代码varo=document.getElemementById(f);则浏览器在执行时会报错,因此此时文本框还未加载。使用JQuery则不用管那么多,在页面头或者尾部尽管用$(document).ready(function(),这也是JQuery的好处。其他都很简单,概括的说,对于输入框如textbox,select等则用val()获取/设置其值,对于div,p,span等则是html()获取/设置其值,$.get(GetTicks.aspx,function(result)表示数据处理会由GetTicks.as

4、px执行,GetTicks.aspx很简单,如下intNoOfTicketsAvailable=5;Response.Write(NoOfTicketsAvailable.ToString();Response.End();注意:需要Response.End();这样既OK了。Sample2:JQuery支持基于Post的AJAX和Sample1差别不大代码如下不过,需要注意的是这里传递了参数TicReq,对于URL,一般都是name=key的方式,例如default.aspx?id=1,则可以使用Request.QueryStringid获取id的值为1,所以上面传递的相当于GetTicks

5、ByPost.aspx?TicReq=ticketsReq (不过,这里的ticketsReq是个变量值,系统自动转换)所以在GetTicksByPost.aspx里就可用获取该参数运行结果同上Sample3:JQuery支持基于ASP.NETAJAX的AJAX要在ASP.NETAJAX里使用JQuery,需要将EnablePageMethods设置为true。如下接下来,就可以使用ASP.NET AJAJX技术了,如下然后使用即可,请注意URL的格式,页面后面跟的是方法url:default.aspx/GetAvailableTickets,表示使用default.aspx里定义的GetAv

6、ailableTickets方法。后台代码如下,注意:需要添加WebMethod修饰符。Sample3:JQuery支持基于ASP.NETAJAX的AJAX传递参数下面是主要代码,注意参数是通过data传递的因为传递了no参数,所以在后台就可用直接使用注意:这里后天里的参数名需要和前台ajax里定义的参数一样Sample4:JQuery支持基于ASP.NETAJAX的AJAX传递参数到WebService如果使用WebService,需要在类前加入System.Web.Script.Services.ScriptService看下面的代码(在default.js文件里的)下面是webservice文件,注意红色的标示。Sample5:建立类似博客园的闪存具体见代码,因为我只实现了数据提交,会了上面的 ,下面的很容易实现

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 生活休闲 > 社会民生

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号