`
MII快跑
  • 浏览: 10494 次
  • 性别: Icon_minigender_2
  • 来自: 广州
社区版块
存档分类
最新评论

分享ajax的一个小例子(代码)

    博客分类:
  • ajax
阅读更多
ajax.jsp代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title> New Document </title>
  <script type="text/javascript">
  <!--

    var xmlHttpReuquest = null;//声明一个空对象以接受XMLHttpRequest对象
var ajaxSubmit = function()
{
if(window.ActiveXObject)//IE
{
xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest)//Other Brownser
{
xmlHttpRequest = new XMLHttpRequest();
}
if(null != xmlHttpRequest)
{
var value1 = document.getElementById("v1").value;
var value2 = document.getElementById("v2").value;
// 准备发送
//xmlHttpRequest.open("GET","AjaxServlet?num1="+value1+"&num2="+value2,true);
// 状态改变
//xmlHttpRequest.onreadystatechange = ajaxCallBack;
// 发送
//xmlHttpRequest.send(null);//如果是通过get传递的就填null或者不填。

xmlHttpRequest.open("POST","AjaxServlet",true);
xmlHttpRequest.onreadystatechange = ajaxCallBack;
xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttpRequest.send("num1="+value1+"&num2="+value2);

}
}


function ajaxCallBack()
{
//alert("hello");//执行的时候会调用4次。
          //这里可以参考此博客http://201303272244.iteye.com/admin/blogs/1839944
if(xmlHttpRequest.readyState == 4)
{
if(xmlHttpRequest.status == 200)
{
var responseText =xmlHttpRequest.responseText;
document.getElementById("divt").innerHTML = responseText;
}
}
}
  //-->
  </script>
</head>
<body>
<input type="submit" value="click this button" onclick="ajaxSubmit();">
<input type="text" id="v1" name="num1">
<input type="text" id="v2" name="num2">
<div id="divt" class="">
</div>
</body>
</html>

AjaxServlet.java

public class AjaxServlet extends HttpServlet
{
protected void doGet(HttpServletRequest req,HttpServletResponse resp)
throws ServletException,IOException
{
PrintWriter out = resp.getWriter();

System.out.println("get or post invoked");
resp.setHeader("pragma","no-cache");
resp.setHeader("cache-control","no-cache");//无缓存

String value1 = req.getParameter("num1");
String value2 = req.getParameter("num2");

String value3 = String.valueOf(Interger.valueOf(value1)+Interger.valueOf(value2));
try
{
Thread.sleep(3000);//延迟3s
}
catch (InterruptedException e)
{
e.printStackTrace();
}
out.println(value3);
out.flush();
}

protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException,IOException
{
this.doGet(req,resp);
}
}

分享到:
评论

相关推荐

    jquery+ajax例子

    总结起来,"jQuery+Ajax例子"是一个展示如何在MyEclipse环境下使用jQuery进行Ajax请求的实践项目。它涵盖了jQuery的Ajax方法、与Java后端的交互以及开源精神的应用,对于理解Web开发中的异步通信具有很高的参考价值...

    分享代码,基于MicroSoftAjax的JS代码之1:异常处理

    在这个例子中,如果`value`为假,则会抛出一个异常,并附带`message`作为错误信息。 通过结合使用JavaScript和MicroSoftAjax的异常处理机制,开发者可以构建更健壮的AJAX应用,能够优雅地处理错误,提供更好的用户...

    ajax例子(jsp版)

    下面将详细介绍如何使用JSP和Ajax进行交互,并分享一个简单的示例。** **一、Ajax基本原理** Ajax的核心是JavaScript的XMLHttpRequest对象,它允许在后台与服务器交换数据并更新部分网页内容。在用户看来,页面是...

    java Ajax 基础 例子 好用啊

    "Ajax例子.doc"可能是包含了一些实际的AJAX代码示例,包括如何创建XMLHttpRequest对象,发送GET或POST请求,以及处理服务器响应。"Ajax学习笔记 - 令狐冲和酒壶 - 博客园.mht"则可能是一位名为“令狐冲和酒壶”的博...

    ajax上传图片 是个yahoo接口做的例子

    在这个"ajax上传图片"的例子中,我们看到它与Yahoo的一个接口相结合,为用户提供了无缝的图片上传体验。下面将详细探讨这个知识点。 首先,Ajax的核心是JavaScript对象XMLHttpRequest,它允许在后台与服务器进行...

    ExtJs 3.1的一些小例子源代码

    这个压缩包中的"ExtJs 3.1的一些小例子源代码"提供了一系列实际应用的示例,可以帮助开发者更好地理解和学习ExtJs 3.1版本的核心功能和特性。 1. **ExtJs 3.1概述** ExtJs 3.1是该框架的一个重要版本,它包含了...

    300个JavaScript小例子

    JavaScript,简称JS,是一种...每一个例子都是一个小型的代码片段,便于理解和实践。这将帮助初学者快速上手,同时对有经验的开发者也有一定的参考价值,他们可以通过这些例子复习和巩固JavaScript知识,提升编程技巧。

    ajax例子

    这篇博客文章"ajax例子"提供了关于如何在实际项目中应用Ajax的示例,作者yanwu在iteye博客平台上分享了这些内容。通过阅读这篇文章,读者可以学习到以下关键知识点: 1. **XMLHttpRequest对象**:Ajax的核心是...

    一个基于AJAX+EXT+ PHP技术实现的班级通讯录典型源码例子

    在文件名称列表中,"codefans.net"可能是一个网站或者文件夹的名称,暗示着源代码可能来源于CodeFans社区,这是一个分享编程知识和技术的平台。在这个项目中,开发者可能从该网站获取了灵感或代码资源,用于构建这个...

    web代码例子上传

    在Web开发中,"代码例子上传"通常是指在网站上实现用户能够上传代码片段或整个项目的功能。这个功能对于教学、分享代码示例或者协作编程非常...通过合理的前端设计和后端实现,可以创建一个安全、高效的代码分享平台。

    JAVA基础学习代码分享

    这个压缩包“JAVA基础学习代码分享”包含了多个关键的Java Web开发技术的实例代码,包括Servlet、Spring、Spring MVC、Spring MyBatis、JSON以及AJAX。这些技术是现代Web应用程序开发的核心组成部分,下面我们将逐一...

    分享Ajax创建简单实例代码

    今天,我们将分享一个创建Ajax简单实例的代码示例,帮助初学者理解如何在实际项目中应用Ajax。 首先,我们需要了解什么是XMLHttpRequest对象。XMLHttpRequest是一个JavaScript对象,它提供了一种在后台与服务器交换...

    struts-ajax.rar_ajax struts _struts ajax_struts ajax war

    从压缩包子文件的文件名称列表来看,"www.pudn.com.txt"可能是一个介绍或者教程的链接,通常PUDN是一个分享技术资源的网站,而"struts-ajax"可能是一个目录,包含了整个示例项目的源代码和其他相关文件。开发者可以...

    Jquery AjaxUpload实现文件上传功能代码

    随着WEB技术的发展,用户体验成为衡量网站成功与否的关键,今天和大家分享如何在PHP中利用Jquery实现Ajax方式文件上传功能的例子,其中使用到了Jquery插件Ajaxupload,其可以实现单个文件和多文件上传功能。

    代码加亮的例子

    代码加亮是编程和网页设计中的一个重要环节,它使得源代码更加易读、美观,能够帮助开发者更快地理解和分析代码。在本示例中,我们关注的是JavaScript(JS)语言的代码高亮应用。JavaScript是一种广泛使用的编程语言...

    好早以前整理的ajax的例子

    在提供的链接中,博主分享了一个关于Ajax的实例,可能涉及创建Ajax请求、处理响应以及更新页面内容。具体代码没有给出,但可以从`stuajax.ppt`这个文件名推测,可能是一个关于学生信息管理的示例。这个PPT可能包含...

    DWR的几种小事例Ajax

    DWR和Ajax是核心技术,而AjaxDWR是DWR的一个关键组件,它提供了Ajax接口,使得JavaScript可以方便地调用Java对象。DWR的Ajax功能包括但不限于以下几点: 1. **异步通信**:DWR允许JavaScript异步地调用服务器端的...

    codeigniter 代码实例分享

    jQuery是一个广泛使用的JavaScript库,简化了DOM操作、事件处理和AJAX交互。 10. **user_guide**:CodeIgniter的用户指南,通常包含详细的框架文档,有助于开发者理解和学习如何使用CodeIgniter的各种功能。 通过...

    Ajax百度搜索项目实例分享源码学习a

    本项目实例“Ajax百度搜索项目实例分享源码学习a”是针对Java开发人员设计的一个教学资源,旨在帮助他们深入理解如何使用Ajax技术来实现类似百度搜索的交互体验。 在实际的Web应用开发中,Ajax的核心优势在于提高了...

    jquery 插件ajaxupload 的简单应用

    AjaxUpload常用于需要快速、无刷新上传文件的场合,如社交媒体平台的图片分享、在线文档编辑工具、文件分享网站等。它的灵活性和易用性使其成为开发人员的首选工具之一。 总结,jQuery插件AjaxUpload为Web开发者...

Global site tag (gtag.js) - Google Analytics