视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
prototype.js简单实现ajax功能示例
2020-11-27 22:27:23 责编:小采
文档

本文实例讲述了prototype.js简单实现ajax功能。分享给大家供大家参考,具体如下:

原本不知道prototype.js是一个框架,只当其是一个再普通不过的JS文件.随手拿着用了用,写了一个JSP页面,单纯的用prototype.js来实现AJAX效果.用了之后发现超好用,自己再也不用写那么大一堆代码了,哦耶.言归正传,还是把今天写的那个小代码发上来.

一.JSP部分

这部分的代码,最为关键的是JS部分的改变.没有采用prototype.js的时候,生成一个AJAX效果,起码得有四大段.现在,只用写成下面这一小段代码了.

<script type="text/javascript">
function getnodelist(){
 function onSuccess(request)
 {
 alert("success");
 $("result").innerHTML = "abc"+request.responseText ;
 }
 function onComplete(request){
 }
 function onFailure(request){
 alert("failure");
 $("result").innerHTML = request.responseText ;
 }
 var paras = "" ;
 var ajax = new Ajax.Request(
 "http://localhost:8080/LoginDemo/test.do",
 {
 method: 'post',
 parameters:paras ,
 onSuccess: onSuccess,
 onComplete:onComplete,
 onFailure:onFailure
 }
 );
}
</script>

其中最重要的就是这一段了:

var ajax = new Ajax.Request( //新生成一个AJAX.Request对象.
 "http://localhost:8080/LoginDemo/test.do", //请求的servlet地址.即URL
 { //参数
 method: 'post',
 parameters:paras ,
 onSuccess: onSuccess, //这些函数和上面三个函数相对应.
 onComplete:onComplete,
 onFailure:onFailure
 });

注明:,里面的URL要么写成绝对路径,要么就在前面取<% String path = request.getContextPath();%>,然后在这里
"<%=path%>/test.do"

prototype.js让我觉得最方便的地方就在于我不用自己去判断当前浏览器的状态,如果成功了就调用OnSuccess函数,失败就调用onFailure函数,而我只用关注于成功失败之后该怎么处理,简化了程序.

二.后台struts部分

public ActionForward execute(
 ActionMapping mapping,
 ActionForm form,
 HttpServletRequest request,
 HttpServletResponse response) {
 // TODO Auto-generated method stub
 try{
 System.out.println("in action");
 response.setContentType("text/html;charset=gb2312");
 ServletOutputStream out = response.getOutputStream();
 out.print("hello slf!");
 System.out.println("out");
 }catch(Exception e)
 {
 e.printStackTrace();
 }
 return null;
 }

简单的打印.

希望本文所述对大家prototype.js框架的程序设计有所帮助。

下载本文
显示全文
专题