ICode9
精准搜索请尝试： 精确搜索
首页
编程语言>
数据库
系统相关
互联网
其他分享
Python
Java
JavaScript
android
PHP
首页 > 其他分享> 文章详细

Ajax 基础入门

2021-01-19 23:57:05  阅读：105  来源： 互联网

标签：入门 基础 springframework Ajax import org com public name


Ajax简介

Ajax即Asynchronous JavaScript And XML(异步的JavaScript和XML) 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。Ajax的核心对象就是xmlHttpRequest，XMLHttpRequest用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新，而重定向和请求转发都是需要加载整个网页，因此使用Ajax技术能获得更好的用户体验。

采用jQuery方式使用Ajax技术：

环境：spring+springMVC+Mybatis

pom.xml:

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.wu.ajax</groupId>
  <artifactId>AjaxDemo1</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <packaging>war</packaging>
  
  <!--  版本锁定 -->
  <properties>
  	<springVersion>5.2.0.RELEASE</springVersion>
  </properties>
  
  <!--  坐标导入 -->
  <dependencies>
  	<dependency>
  		<groupId>org.springframework</groupId>
  		<artifactId>spring-context</artifactId>
  		<version>${springVersion}</version>
  	</dependency>
  	<dependency>
  		<groupId>org.springframework</groupId>
  		<artifactId>spring-webmvc</artifactId>
  		<version>${springVersion}</version>
  	</dependency>
  	<dependency>
  		<groupId>org.springframework</groupId>
    	<artifactId>spring-jdbc</artifactId>
    	<version>${springVersion}</version>
  	</dependency>
  	
  	<dependency>
  		<groupId>junit</groupId>
  		<artifactId>junit</artifactId>
  		<version>4.12</version>
  	</dependency>
  	<dependency>
  		<groupId>org.mybatis</groupId>
		  <artifactId>mybatis</artifactId>
		  <version>3.5.2</version>
  	</dependency>
  	<dependency>
  		<groupId>javax.servlet</groupId>
	    <artifactId>javax.servlet-api</artifactId>
	    <version>4.0.1</version>
  	</dependency>
  	<dependency>
  		<groupId>javax.servlet</groupId>
  		<artifactId>jstl</artifactId>
  		<version>1.2</version>
  	</dependency>
  	<dependency>
  		<groupId>org.mybatis</groupId>
    	<artifactId>mybatis-spring</artifactId>
    	<version>1.3.2</version>
  	</dependency>
  <dependency>
  		<groupId>mysql</groupId>
    	<artifactId>mysql-connector-java</artifactId>
    	<version>8.0.22</version>
  	</dependency>
  <dependency>
  		<groupId>taglibs</groupId>
    	<artifactId>standard</artifactId>
    	<version>1.1.2</version>
  	</dependency>
  	<dependency>
  		<groupId>org.aspectj</groupId>
  		<artifactId>aspectjweaver</artifactId>
  		<version>1.9.0</version>
  	</dependency>
  	<dependency>
  		<!--  数据库连接池 -->
  		<groupId>com.mchange</groupId>
    	<artifactId>c3p0</artifactId>
    	<version>0.9.5.5</version>
  	</dependency>
  	<dependency>
  		<groupId>com.fasterxml.jackson.core</groupId>
    	<artifactId>jackson-databind</artifactId>
    	<version>2.12.0</version>
</dependency>
<dependency>
	  	<groupId>log4j</groupId>
	  	<artifactId>log4j</artifactId>
	  	<version>1.2.17</version>
	  </dependency>
  </dependencies>
  
</project>

web.xml:

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd" id="WebApp_ID" version="4.0">
  <display-name>AjaxDemo1</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
	
	<servlet>
	  	<servlet-name>SpringMVC</servlet-name>
	  	<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
	  	<!--  DispatcherServlet绑定Spring的配置文件  -->
	  	<init-param>
	  		<param-name>contextConfigLocation</param-name>
	  		<param-value>classpath:applicationContext.xml</param-value>
	  	</init-param>
	  	<!-- 启动级别为1  -->
	  	<load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
  		<servlet-name>SpringMVC</servlet-name>
  		<url-pattern>/</url-pattern>
  	</servlet-mapping>
	
	<!--  乱码问题解决 -->
	<filter>
		<filter-name>encodingFilter</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>encodingFilter</filter-name>
		<url-pattern>/*</url-pattern>
	</filter-mapping>
	
	<!--  会话时长设置 -->
	<session-config>
		<session-timeout>20</session-timeout>
	</session-config>
</web-app>

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"
	xsi:schemaLocation="http://www.springframework.org/schema/beans
	http://www.springframework.org/schema/beans/spring-beans.xsd">

	<import resource="classpath:spring-mvc.xml"></import>
	<import resource = "classpath:spring-dao.xml"></import>
	<import resource = "classpath:spring-service.xml" ></import>
</beans>

mybatis-config.xml:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE  configuration
	PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
	"http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
	<settings>
        <setting name="logImpl" value="LOG4J" />
    </settings>
	<!-- 对name名称下的包取别名 -->
	<typeAliases>
		<package name="com.wu.pojo"></package>
	</typeAliases>
	<mappers>
		<mapper resource="com/wu/mapper/StudentMapper.xml"/>
	</mappers>
</configuration>

spring-mvc.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:context="http://www.springframework.org/schema/context"
	xmlns:mvc="http://www.springframework.org/schema/mvc"
	xsi:schemaLocation="http://www.springframework.org/schema/beans
	http://www.springframework.org/schema/beans/spring-beans.xsd
	http://www.springframework.org/schema/context
	http://www.springframework.org/schema/context/spring-context.xsd
	http://www.springframework.org/schema/mvc
	http://www.springframework.org/schema/mvc/spring-mvc.xsd">
	
	<!--  开启注解 -->
	<mvc:annotation-driven />
	<!--  扫描使用注解的controller包 -->
	<context:component-scan base-package="com.wu.controller" />
	<!--  资源过滤  -->
	<mvc:default-servlet-handler/>
</beans>

spring-dao.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:context="http://www.springframework.org/schema/context"  
    xsi:schemaLocation="http://www.springframework.org/schema/beans  
    http://www.springframework.org/schema/beans/spring-beans.xsd  
    http://www.springframework.org/schema/context  
    http://www.springframework.org/schema/context/spring-context.xsd"> 
	
	
	<!--  关联数据库配置文件 -->
	<context:property-placeholder location="classpath:/database.properties"/>
	
	<bean id = "dataSource" class = "com.mchange.v2.c3p0.ComboPooledDataSource">
		<property name = "driverClass" value="${jdbc.driver}"/>
		<property name = "jdbcUrl"  value = "${jdbc.url}"/>
		<property name = "user"  value = "${jdbc.username}" />
		<property name = "password" value = "${jdbc.password}" />
		 
		 <property name ="maxPoolSize" value="${maxPoolSize}" /> <!--最大连接数-->
		<property name ="initialPoolSize" value="${initialPoolSize}"/> <!--初始化连接数-->
		<property name ="minPoolSize" value="${minPoolSize}" /> <!--最小连接数-->
		<property name = "autoCommitOnClose" value = "false" /> <!--  关闭连接后不自动提交 -->
	</bean>
	
	<bean id = "sqlSessionFactory" class = "org.mybatis.spring.SqlSessionFactoryBean">
		<property name = "dataSource" ref = "dataSource" />
		<!--  绑定Mybatis的配置文件 -->
		<property name = "configLocation" value = "classpath:/mybatis-config.xml" />
	</bean>
	
	<!--  将实现Mapper接口类注入Spring容器中 -->
	<bean class = "org.mybatis.spring.mapper.MapperScannerConfigurer" >
		<property name = "sqlSessionFactoryBeanName" value = "sqlSessionFactory" />
		<property name = "basePackage" value = "com.wu.mapper"/>
	</bean>
	
</beans>

database.properties:

jdbc.driver=com.mysql.cj.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/test?serverTimezone=UTC
jdbc.username=root
jdbc.password=root
initialPoolSize=10
maxPoolSize=30
minPoolSize=10

log4j.properties:

# 级别为debug 控制台输出
log4j.rootLogger=DEBUG, cosole
log4j.appender.cosole=org.apache.log4j.ConsoleAppender
log4j.appender.cosole.layout=org.apache.log4j.PatternLayout
log4j.appender.cosole.layout.ConversionPattern=%5p [%t] - %m%n

pojo类：

package com.wu.pojo;

public class Student {
	private String name;
	private Long id;
	private Integer age;
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public Long getId() {
		return id;
	}
	public void setId(Long id) {
		this.id = id;
	}
	public Integer getAge() {
		return age;
	}
	public void setAge(Integer age) {
		this.age = age;
	}
}

mapper类及配置文件：

package com.wu.mapper;

import java.util.List;

import org.apache.ibatis.annotations.Param;

import com.wu.pojo.Student;

public interface StudentMapper {
	List<Student> findStudentByName(@Param("studentName") String name);
}

StudentMapper.xml:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
	PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
	"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace = "com.wu.mapper.StudentMapper">

	<select id="findStudentByName" resultType = "Student" parameterType = "string" >
		select * from student where student_name like CONCAT('%',#{studentName},'%')
	</select>
</mapper>

service类：

<?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:context="http://www.springframework.org/schema/context"
    xmlns:aop="http://www.springframework.org/schema/aop"
    xmlns:tx="http://www.springframework.org/schema/tx"  
    xsi:schemaLocation="http://www.springframework.org/schema/beans  
    http://www.springframework.org/schema/beans/spring-beans.xsd  
    http://www.springframework.org/schema/context  
    http://www.springframework.org/schema/context/spring-context.xsd
    http://www.springframework.org/schema/aop
    http://www.springframework.org/schema/aop/spring-aop.xsd
    http://www.springframework.org/schema/tx
    http://www.springframework.org/schema/tx/spring-tx.xsd"> 
	
	<context:component-scan base-package = "com.wu.service" />
	
	
	<!--  声明事务配置 -->
	<bean id = "transactionManager" class = "org.springframework.jdbc.datasource.DataSourceTransactionManager">
		<property name = "dataSource" ref = "dataSource" />
	</bean>
	
	<!--  配置事务通知 -->
	<tx:advice id = "txAdvice" transaction-manager="transactionManager">
		<tx:attributes>
			<tx:method name="find*" read-only="true"/>
		</tx:attributes>	
	</tx:advice>
	
	<!--  配置事务切入 -->
	<aop:config>
		<aop:pointcut expression="execution(* com.wu.service.*.*(..))" id="txPointCut"/>
		<aop:advisor advice-ref="txAdvice" pointcut-ref="txPointCut"/>
	</aop:config>
</beans>

controller类：

package com.wu.controller;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Qualifier;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.wu.pojo.Student;
import com.wu.service.IStudentService;

@Controller
@RequestMapping("/ajax")
public class MyController {
	
	@Autowired
	@Qualifier("studentService")
	private IStudentService studentService;
	
	@RequestMapping(path = "/ajaxTest",method = RequestMethod.POST)
	@ResponseBody
	public String ajaxTest(String name) {
		List<Student> studentList = studentService.findStudentByName(name);
		ObjectMapper mapper = new ObjectMapper();
		String result = null;
		try {
			result = mapper.writeValueAsString(studentList);
			return result;
		} catch (JsonProcessingException e) {
			e.printStackTrace();
			return null;
		}
	}
}

index.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Ajax</title>
	<script type="text/javascript" src = "jquery/jquery-3.2.1.js"></script>
	<script type = "text/javascript">
		function onchangeFun(){
			$.ajax({
				url:"ajax/ajaxTest",
				type:"POST",
				data:{"name":$("#studentname").val()},
				success: function(data) {
					alert(data);
				}
			});
		}
	</script>
</head>
<body >
	<br><br><hr>
	<div align = "center">
		学生姓名：<input id = "studentname" type="text" onblur="onchangeFun()"/>
	</div>
</body>
</html>

标签：入门,基础,springframework,Ajax,import,org,com,public,name
来源： https://blog.csdn.net/weixin_43914658/article/details/112815938

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

关于我们 | 联系我们 | 留言反馈

专注分享技术，共同学习，共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有