`

Jquery简单Ajax的封装,简化开发

阅读更多

        开发过程中经常要用到Ajax从后天返回一些数据,从官网API上学习得,可以这样使用:

$.ajax({
   url:"/school_class/studentInfoAction_validatorCode.action?studentInfoVo.studentNo="+$("#studentNo").val()+"&studentInfoVo.studentinfoId="+$("#id").val(),
   type:"post", //post提交
   async:false, //用同步

   timeout:3000,
   success:function(html) {//成功时回调函数
    if(html==""){

业务操作
       }else{

业务操作
            }
   } ,

error :function(result){//出错时调用的函数,我们经常要使用,不然有时候出错了很难知道是什么原因。

}
  });

 

每次都这么写,这么多行,是否有点麻烦,我们可以简单地做下封装:

ajaxSubmit = function(url,data){
  var msg = null;
  jQuery.ajax({
     type: "POST",
     url: url,
     async : false,
     data: data,
     success: function(html){
       msg = html;
     }

error: function(html){
       alert(html);

     }

  });
  return msg;
};

则以后就可以这么简单的使用了

var url ="/school_class/studentInfoAction_getRelated.action";//到达后台的URL地址
   var data = "formMap.yearId="+obj.value;//传到后台的数据
   var mess= ajaxSubmit(url,data);//返回的数据

分享到:
评论

相关推荐

    使用 jQuery 简化 Ajax 开发

    jQuery 通过封装 Ajax 相关的操作,进一步简化了 Ajax 的使用方式,使得开发者可以轻松地实现动态数据加载和页面更新等功能。 #### 三、jQuery 简化 Ajax 开发的关键点 1. **简化 DOM 操作**: - jQuery 提供了...

    jQuery 封装Ajax

    在提供的文件中,`common_gui.js`可能包含了自定义的Ajax封装,而`jquery.json-2.2.min.js`可能是用于解析JSON数据的辅助工具。在实际使用时,结合这些资源,我们可以构建更高效、更安全的Ajax通信流程。

    Jquery Ajax分页(有实例)

    通过以上分析,我们了解到jQuery AJAX分页不仅简化了开发流程,还提供了丰富的自定义可能性。在"JqureySweepPagesDemo"中,你可以看到这些特性的实际应用,为你的Web项目带来高效、美观的分页功能。对于初学者,这个...

    jquery,ajax的几个小例子

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

    Jquery Ajax简易计算器

    "jQuery AJAX简易计算器"是一个实用示例,展示了如何利用jQuery和AJAX实现一个简单的动态计算功能。通过这个项目,开发者可以学习到如何在客户端和服务器之间有效地交换数据,以及如何更新页面内容而无需刷新整个...

    Jquery 封装下的ajax异步加载

    jQuery 是一个广泛使用的JavaScript库,它极大地简化了AJAX操作。本资源提供了一个基于jQuery的AJAX异步加载的Web项目实例,通过导入MyEclipse开发环境即可运行,涉及到的主要技术包括jQuery、JSON以及Servlet。 ##...

    jquery+ajax的视频讲解

    在“第八章后jQueryAjax的使用”中,我们将深入探讨如何利用jQuery进行AJAX操作。 **AJAX基础** AJAX(Asynchronous JavaScript and XML)是一种创建动态网页的技术,允许在不重新加载整个页面的情况下,与服务器...

    jquery、ajax学习电子书.zip

    《jQuery与Ajax学习指南》是一本专为初学者和有一定JavaScript基础的开发者设计的电子书,旨在帮助读者深入理解和熟练掌握这两个在实际Web开发中不可或缺的技术。jQuery是一个强大的JavaScript库,它极大地简化了DOM...

    Struts2+Jquery+Ajax

    通过理解MVC模式、熟练掌握Struts2的配置和Action处理、灵活运用Jquery和Ajax,可以大大提高开发效率,提升用户使用体验。在实际开发过程中,还需要关注安全问题,如Struts2的安全漏洞,确保应用的稳定性和安全性。

    jQuery版AJAX简易封装代码

    AJAX(Asynchronous JavaScript...以上总结的知识点涵盖了 jQuery AJAX 的基础知识,以及如何进行封装以简化开发流程。通过掌握这些内容,开发者可以高效地利用 jQuery 进行 AJAX 请求,满足动态网页和应用的交互需求。

    jquery+AJAX小小项目

    jQuery提供了$.ajax()方法,方便地封装了XMLHttpRequest对象,使得使用AJAX变得更加简单。在这个项目中,主要使用了以下jQuery的AJAX相关函数: 1. **$.get()**:用于发送GET请求。例如: ```javascript $.get('...

    javascript+jquery+ajax相关学习资料PPT

    2. JQueryAjax教程讲解.ppt:这可能是关于使用jQuery进行AJAX请求的详细讲解,包括$.ajax()函数,$.get()和$.post()方法的使用,以及如何处理回调函数。 3. Jquery(很好的PPT教程-技术较为全面-分享给大家).ppt:这...

    jquery+ajax例子

    然而,jQuery通过封装这个对象,提供了更友好的$.ajax()函数,使得Ajax请求更加直观和易于实现。 3. **jQuery中的Ajax方法** - **$.ajax()**:这是jQuery中最全面的Ajax方法,可以设置各种参数,如URL、类型(GET...

    jQuery_Ajax_Json全解析

    在Web开发中,jQuery、Ajax和JSON是不可或缺的工具,它们共同构建了现代网页的动态交互体验。本解析将深入探讨这三个概念及其相互关系。 **jQuery:简化JavaScript操作** jQuery是一个轻量级的JavaScript库,由...

    jquery和ajax结合的使用实例

    jQuery简化了JavaScript的DOM操作、事件处理和动画制作,而Ajax(异步JavaScript和XML)则允许在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。本篇文章将深入探讨如何将两者结合,实现用户名和密码的...

    jquery-ajax教程

    在Ajax方面,jQuery提供了强大的封装,使得原本繁琐的过程变得简单易行。接下来,我们将通过对比原始Ajax与jQuery中的Ajax实现方式来深入了解这一变化。 #### 三、原始Ajax与jQuery中的Ajax ##### 原始Ajax的实现 ...

    JQuery+AJAX处理XML数据

    在网页开发中,jQuery 和 AJAX 技术的结合是获取和操作服务器端数据的常见方式。本篇将详细探讨如何使用 jQuery 的 AJAX 功能来处理 XML(可扩展标记语言)数据。 **1. jQuery 和 AJAX 简介** jQuery 是一个流行的...

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

    jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作以及Ajax交互。在本场景中,jQuery将用于处理前端的Ajax请求。 其次,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的...

    jQuery-AJAX.zip_jquery ajax

    总结,jQuery与AJAX的结合,使得Web开发变得更加高效和便捷,通过简单的API调用,开发者可以轻松地实现页面动态更新,提升用户体验。同时,理解它们的工作原理和应用方式,对于提升Web开发技能至关重要。无论是新手...

    利用jquery以及ajax实现树结构

    - AJAX交互:jQuery封装了`$.ajax()`函数,使得发送HTTP请求变得简单,例如`$.ajax({url: 'your-url', type: 'GET', success: function(data) {...}})`。 2. **实现树结构**: - HTML基础:树形结构通常由`<ul>`...

Global site tag (gtag.js) - Google Analytics