`

Jquery实现Ajax的疑点

 
阅读更多

爱生活爱拼搏!一起学习----有错误请大虾们指点下。。。。。。。。。

   今天遇到个问题,于是写了个简单的实例:JQuery实现Ajax实现JSON方式显示获取的数据:
关键代码如下:
//接收json
var s="";
$("#button").click(
function(){
//通过jQuery请求JsonServlet
$.post("JsonServlet",function(data){
s+=data.name+"\n"+data.sex+"\n"+data.age;
alert(s);//第一次显示s消息框
},"json");
         alert(s);//接着显示
     }
);
页面代码一句:
  <input type="button" value="test3" id="button"/>
Servlet代码:
                 JSONObject j = new JSONObject();
j.put("name", "admin");
j.put("sex", "boy");
j.put("age", 16);
PrintWriter out = response.getWriter();
out.println(j.toString());
out.flush();
运行第一次点击按钮页面跳出两个消息框:
第一次点击时候------------>
显示获取json里面的数据:

接着第二个消息框----------->


接着第二次点击按钮页面跳出两个消息框:
第一个依然是接受json中的数据--->

接着第二个消息框-------------->


假如代码是这样-------------------->
//接收json
$("#button").click(
function(){
var s="";
//通过jQuery请求JsonServlet
$.post("JsonServlet",function(data){
s+=data.name+"\n"+data.sex+"\n"+data.age;
alert(s);
},"json");
alert(s);
    }
);
则不论点击多久都只会出现上面第一次点击的效果,第二个消息框总是为空;

我想这就是Ajax异步机制的原理么,如果把这当成线程看待:
异步消息处理线程是指:线程启动后会进入一个无限循环体之中,每执行一次,从线程内部的消息队列中取出一个消息,并回调相应的消息处理函数,执行完一个消息后则继续循环。。。
我想如果放在同一作用域里面,第一次获取数据时候第二个消息显示框没来得及去获取就默认显示s=“”了,在第一个实例里面,由于s的作用域相当于全局,所以当第二次点击按钮时候,数据把第一次获取的数据放入s里面了,以此类推,第二个消息显示框比第一个显示框里面的数据都会少获取一次数据。。。。。。
   不知道大虾们是怎么理解的,我理解错误没?  有错误请指出来啊! 谢谢了哈,共同学习,爱生活爱拼搏!
  • 大小: 5.5 KB
  • 大小: 4.6 KB
  • 大小: 6.5 KB
  • 大小: 5.5 KB
分享到:
评论

相关推荐

    struts2+json+jquery实现ajax数据的存取

    "Struts2+JSON+jQuery实现Ajax数据的存取"就是一个典型的示例,它结合了强大的MVC框架Struts2、轻量级的数据交换格式JSON以及高效的前端库jQuery,以实现网页上的无刷新数据交互。下面将详细介绍这三个技术及其在...

    jquery实现ajax上传文件asp.net版

    在ASP.NET环境中,使用jQuery和Ajax来实现文件上传是一种常见的技术方案,它可以提供无刷新的用户体验,提升网站的交互性。下面将详细讲解这个过程涉及的关键知识点。 首先,我们需要了解jQuery库。jQuery是一个轻...

    Java通过jQuery实现ajax异步请求

    本示例工程"Java通过jQuery实现ajax异步请求"着重展示了如何利用jQuery的AJAX功能与后端Java服务器进行数据通信,从而实现页面的无刷新更新。以下将详细解释这个过程中涉及的关键知识点。 首先,jQuery是一个强大的...

    JQuery+AJAX实现用户名验证

    在“JQuery+AJAX实现用户名验证”的场景中,我们通常会遵循以下步骤: 1. **前端准备**:在HTML页面中,我们需要一个输入框让用户输入用户名,以及一个按钮触发验证。例如: ```html 请输入用户名"&gt; 验证 ``` 2. **...

    springmvc利用jquery实现ajax的例子

    在本示例中,我们将探讨如何使用Spring MVC框架与jQuery库结合实现Ajax功能。Spring MVC是Spring框架的一部分,专门用于构建Web应用程序,而jQuery则是一个强大的JavaScript库,简化了DOM操作、事件处理以及异步HTTP...

    jQuery+ajax实现三级级联

    在这个“jQuery+ajax实现三级级联”的实例中,我们主要探讨如何利用这两种技术来创建一个能够逐级联动的下拉菜单系统,这在数据筛选和表单填写中十分常见,如地区选择、部门分类等场景。 首先,jQuery是一个轻量级...

    Jquery实现ajax三级联动

    在网页开发中,"Jquery实现ajax三级联动"是一个常见的需求,主要用于动态更新页面内容,如下拉框的联动选择。这种技术可以提高用户体验,减少不必要的页面刷新。在这个场景中,我们将探讨如何利用jQuery和Ajax技术...

    基于jQuery的Ajax聊天室程序

    【基于jQuery的Ajax聊天室程序】是一个典型的Web交互应用,它利用了Ajax技术来实现实时的、无需页面刷新的用户交流。Ajax(Asynchronous JavaScript and XML)是一种在不重新加载整个网页的情况下,能够更新部分网页...

    Asp.net 用jQuery 实现Ajax的效果方法

    在Asp.net开发中,利用jQuery实现Ajax效果可以极大地提升用户体验,因为它允许页面部分更新而无需刷新整个页面。Ajax(Asynchronous JavaScript and XML)技术通过异步方式与服务器通信,使得用户界面更加流畅和响应...

    利用Ajax+Jquery实现异步进度条效果

    "利用Ajax+Jquery实现异步进度条效果"这个主题正是围绕这一目标展开,它涉及到C#后端开发、.NET框架、Ajax技术以及Jquery库的前端应用。下面将详细阐述这些知识点。 首先,C#是一种面向对象的编程语言,广泛应用于...

    jsp中使用jquery实现ajax源码

    在JavaServer Pages (JSP) 中使用jQuery来实现AJAX技术是一种常见的做法,它能够使得网页无需刷新即可与服务器进行异步数据交换。本主题主要围绕以下知识点展开: 1. **JSP(JavaServer Pages)**:JSP是Java的一个...

    通过Jquery实现Ajax传值.rar

    本示例“通过Jquery实现Ajax传值.rar”着重讲解如何在MVC(Model-View-Controller)架构中利用jQuery的Ajax功能来传递数据,避免了传统表单提交带来的页面刷新问题。 首先,理解MVC模式是至关重要的。MVC是一种软件...

    jquery,ajax的几个小例子

    在jQuery中,Ajax功能被封装得十分友好,使得开发者可以轻松地实现异步数据交换。 **一、jQuery中的Ajax基础** 1. **$.ajax()函数**:这是jQuery中最核心的Ajax方法,可以接受多个参数来定制请求。例如,URL、类型...

    Jquery跨域Ajax请求测试

    本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先,了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制,它规定了只有来自同一协议、同一域名和同一...

    jQuery的Ajax实现异步传输List、Map

    本话题将深入探讨如何使用jQuery的Ajax功能实现异步传输List和Map类型的数据,同时涉及JSON数据格式的使用。 首先,让我们了解JSON(JavaScript Object Notation),它是轻量级的数据交换格式,易于人阅读和编写,...

    jQuery+ajax实现简单登录验证

    在本文中,我们将深入探讨如何使用jQuery和Ajax技术实现一个简单的登录验证系统。这个系统能够实时检查用户输入的用户名和密码是否有效,而无需页面刷新,从而提供更流畅的用户体验。 首先,jQuery是一个轻量级的...

    Asp.Net MVC之jQuery与AJAX操作实例

    在Asp.Net MVC框架中,jQuery和AJAX的结合使用极大地提升了用户体验,使得网页能够实现异步数据交互,无需刷新整个页面即可完成数据的增删查改操作。本实例将深入探讨如何在Asp.Net MVC项目中应用jQuery与AJAX。 一...

    Struts2整合jQuery实现Ajax功能

    ### Struts2整合jQuery实现Ajax功能 #### 一、引言 随着Web应用程序的发展,用户对交互性和响应速度的要求越来越高。传统的Web表单提交方式已无法满足这些需求,因此Ajax技术逐渐成为提升用户体验的重要手段之一。...

Global site tag (gtag.js) - Google Analytics