<script type="text/javascript" src="js/jquery-1.11.1.js"></script>

$.ajax()-->XMLHttpRequest

$.ajax({

url:xxx,type:post|get,data:提交的数据,async:true|false同步或异步处理,dataType:json|html|script预期服务器返回结果类型,success:成功回调函数,error:失败的回调函数,beforeSend:请求发送前回调函数,

});

$("#showBtn"),id选择器

$(".showBtn"),类选择器

$("a"),所有a标签

$("table tr") table下面的所有tr

<a href="#" id="showBtn">查看上证指数</a>

$("#showBtn").click(function(){});

var s_opt='<option value="'+id+'">'+name+'</option>';

var $opt=$(s_opt);//将字符串转换成jquery对象

//将option添加到select中

$("s1").append($opt);

省份:

<select id="s1"></select>

1.触发事件源,下拉选择框,$("#s1")

2.触发事件时机,onchange选项发生改变

3.执行什么样操作

//提取当前选中的option内容

//将内容显示到span中

$(function(){

  $("#s1").change(function(){

    //提取选中项

    var value=$("#s1 option:selected").text();//var value=$("#s1").val();

    //显示到span中

    $("#name_span").html(value);

  });

})

Servlet往前台传jsp:

Note note=new Note();

//note.setXXX();填很多例子

JSONObject json=JSONObject.fromObject(note);

String json_str=json.toString();

//将list转成json字符串

JSONArray jsonlist=JSONArray.fromObject(list);

response.setContentType("text/plain;charset=utf-8");

PrintWriter out=response.getWriter();

out.print(jsron_str);

out.flush();

out.close();


springmvc

--ioc,webmvc

--aplicationContext.xml

/ajax.do

-->DispatcherServlet

-->HandlerMapping

-->LoadNoteController

-->调用jackson.jar包将Controller返回结果转成json格式输出(以前是viewResolver转到jsp)

需要的jar包:

commons-logging-1.2.jar
jackson-annotations-2.2.1.jar
jackson-core-2.2.1.jar
jackson-databind-2.2.1.jar
spring-aop-4.0.2.RELEASE.jar
spring-beans-4.0.2.RELEASE.jar
spring-context-4.0.2.RELEASE.jar
spring-core-4.0.2.RELEASE.jar
spring-expression-4.0.2.RELEASE.jar
spring-web-4.0.2.RELEASE.jar
spring-webmvc-4.0.2.RELEASE.jar

web.xml:

<filter>

<filter-name>myfilter</filter-name>

<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>

<init-param>

<param-name>encoding</param-name>

<param-value>UTF-8</param-value>

</init-param>

</filter>

<filter-mapping>

<filter-name>myfilter</filter-name>

<url-pattern>*.do</url-pattern>

</filter-mapping>

<servlet>

<servlet-name>springmvc</servlet-name>

<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>

<init-param>

<param-name>contextConfigLocation</param-name>

<param-value>classpath:applicationContext.xml</param-value>

</init-param>

<load-on-startup>1</load-on-startup>

</servlet>

<servlet-mapping>

<servlet-name>springmvc</servlet-name>

<url-pattern>*.do</url-pattern>

</servlet-mapping>

applicationContext.xml:

<?xml version="1.0" encoding="UTF-8"?>

<beans  xmlns="http://www.springframework.org/schema/beans"

xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

xmlns:util="http://www.springframework.org/schema/util"

xmlns:p="http://www.springframework.org/schema/p"

xmlns:aop="http://www.springframework.org/schema/aop"

xmlns:context="http://www.springframework.org/schema/context"

xmlns:mvc="http://www.springframework.org/schema/mvc"

xsi:schemaLocation="

http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd

http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.0.xsd

http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.0.xsd

http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd

http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd">

<!-- 配置handlermaping -->

<mvc:annotation-driven/>

<!-- 扫描controller -->

<context:component-scan base-package="org.alexhe"></context:component-scan>

</beans>

LoadNoteController.java:

package org.alexhe.controller;

import java.util.ArrayList;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

import org.alexhe.entity.Note;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.ResponseBody;

@Controller

public class LoadNoteController {

//调用Dao获取笔记数据,采用json返回

@RequestMapping("/ajax.do")

@ResponseBody//将返回结果调用jackson.jar包

public List<Note> execute(){

List<Note> list=new ArrayList<Note>();

Note note=new Note();

note.setId("01");

note.setName("springmvc");

Note note1=new Note();

note1.setId("02");

note1.setName("java");

list.add(note);

list.add(note1);

return list;

}

@RequestMapping("/ajax2.do")

@ResponseBody//将返回结果调用jackson.jar包

public Note load1(){

Note note=new Note();

note.setId("111");

note.setName("look");

return note;

}

@RequestMapping("/ajax3.do")

@ResponseBody//将返回结果调用jackson.jar包

public Map<String,Object> load2(){

Map<String,Object> map=new HashMap<String,Object>();

map.put("id", 1);

Note note =new Note();

note.setId("22");

note.setName("哈哈哈哈");

map.put("我是note", note);

return map;

}

}

jquery和ajax和springmvc的更多相关文章

  1. SpringMVC+Jquery实现Ajax

    一.什么是Ajax? Ajax:异步的JavaScript和Json(这里XML改为了Json): 作用:用于完成网页局部刷新功能(修改少量数据只用局部刷新,不用再整个网页重新加载): 二.Sprin ...

  2. ajax和springmvc的请求响应原理——深入理解jQuery中$.get、$.post、$.getJSON和$.ajax的用法

    1,四大重要部分: 请求链接 post请求和get请求 请求参数形式 响应内容形式 2,从springmvc的controller角度,controller能接收到请求的前提 请求链接必须对应 pos ...

  3. jquery中ajax的使用

    Java软件开发中,后台中我们可以通过各种框架,像SSH等进行对代码的封装,方便我们对Java代码的编写,例如,Struts,SpringMVC对从前台到action的流程进行封装控制,使我们只需要进 ...

  4. Angular和jQuery的ajax请求的差别

    近期项目中使用angular,结果发现后台没法获取參数,所以,略微研究了一下两者在发送ajax时的差别. 注意angular和jquery的ajax请求是不同的. 在jquery中,官方文档解释con ...

  5. JQuery 的Ajax的使用

    JSON:一种轻量级的数据表示方法,优点:传输方便,占用字节少 XML:一种偏重量级的数据表示方法,优点:格式清晰,占用字节多,大量的字节都浪费在了标签上: 网络传输我们常使用json,因为浏览器解析 ...

  6. http 500 Internal Server Error的错误 ajax请求SpringMVC后台中返回500 Internal Server Error

    使用httprequester接口测试能返回数据,但是用ajax返回json格式的时候返回报500Internal Server Error. The server encountered an in ...

  7. Sping MVC不使用任何注解处理(jQuery)Ajax请求(基于XML配置)

    1. Spring Spring框架是一个轻量级的解决方案,是一个潜在的一站式商店,用于构建企业就绪的应用程序.Spring框架是一个Java平台,为开发Java应用程序提供全面的基础架构支持.Spr ...

  8. content-type常见类型辨析(以ajax与springmvc前后端交互为例)

    博客搬家: content-type常见类型辨析(以ajax与springmvc前后端交互为例) 在http报文的首部中,有一个字段Content-type,表示请求体(entity body)中的数 ...

  9. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

随机推荐

  1. MiniUI破解方法

    解决JQuery MiniUI前端库到期alert弹窗 MINIUI的到期提示是通过JS的Alert 方法弹出的. 那么我们可以不可以截获所有Alert方法,过滤文本.然后….你们懂得 我们只需要在页 ...

  2. iOS:UIButton扩大按钮的响应区域

    一.介绍 在开发中有时会遇见设计图里按钮设计的特别小,这时会用到手动扩大UIButton的响应范围 二.方式 下面有两个解决办法: 第一种方法:创建一个类目:UIButton+EnlargeTouch ...

  3. hive-命令操作记录

    Hive 的官方文档请参考:http://wiki.apache.org/hadoop/Hive/LanguageManual . Create Table CREATE [EXTERNAL] TAB ...

  4. 【移动端 Web】怎么循序渐进地开发一个移动端页面

    1. 移动页面开发基础 1.1 像素——什么是像素 像素是 Web 页面布局的基础,那么到底什么才是一个像素呢? 像素:一个像素就是计算机屏幕所能显示一种特定颜色的最小区域.这是像素的概念,实际上,W ...

  5. 关于snowflake算法生成的ID转换为JS的数字类型由于过大导致JS精度丢失的问题

    JS的数字类型目前支持的最大值为:9007199254740992,一旦数字超过这个值,JS将会丢失精度,导致前后端的值出现不一致. JAVA的Long类型的       最大值为:922337203 ...

  6. sqlite3常用技巧

    数据库是一种工具,在合理的条件下使用数据库可以获得许多益处. 使用SQL语句可以完成复杂的统计,可以少写许多复杂逻辑 使用数据库无需担心内存溢出问题 原来可能需要许多文件来保存,现在只需要一个sqli ...

  7. mysqldump详解之--master-data

    在前一篇文章中,有提到mysqldump的--single-transaction参数.另外还有个很重要,也是运维中经常用到的参数:--master-data,网上很多关于MySQL不停机备份的实现都 ...

  8. 单片机成长之路(avr基础篇)- 003 AVR单片机的BOOT区

    BOOT区的由来基于一个简单的道理,即单片机的程序是保存在FLASH中的,要运行程序就必须不停的访问FLASH存储器.对于一般的FLASH存储器,数据的写入需要一定的时间来完成,在数据写入完成之前,存 ...

  9. Java读取Excel内容

    借助于apathe的poi.jar,由于上传文件不支持.jar所以请下载后将文件改为.jar,在应用程序中添加poi.jar包,并将需要读取的excel文件放入根目录即可 本例使用java来读取exc ...

  10. UBANTU zongjie

    1.fatal error: openssl/aes.h: No such file or directory 要在Debian.Ubuntu或者其他衍生版上安装OpenSSL: $ sudo apt ...