Spring和Spring Mvc 5整合详解

Spring和Spring Mvc 5整合详解

一、官方主页

Spring

Spring Mvc

低版本的SpringMvc,可以参考这一篇《Spring和Spring Mvc整合详解》

二、概述

Spring Mvc的启动方式不同于Spring Boot,Spring Boot内嵌了tomcat容器,可以打包成jar文件快速启动。Spring Mvc仍需要打包成war包。所以,它是离不开web.xml配置。

配置Spring和Spring Mvc,主要有:

  • 1.在web.xml中配置好Spring相关Listener/Filter/Servlet,并指明Spring和Spring Mvc的配置文件,当然,也可以不指定,放在classpath下就行,严谨一点还是写出来为好。
  • 2.配置applicationContext.xml,这个是给Spring用的,名字随意,只要在web.xml指定就行。
  • 3.配置 spring-servlet.xml,这个是给Spring Mvc用的,名字随意,只要在web.xml指定就行。

Git地址:

Gitee

品茗IT:提供在线快速构建Spring项目工具。

**如果大家正在寻找一个java的学习环境,或者在开发中遇到困难,可以<a

href="https://jq.qq.com/?_wv=1027&k=52sgH1J"

target="_blank">

加入我们的java学习圈,点击即可加入

</a>

,共同学习,节约学习时间,减少很多在学习中遇到的难题。**

三、开始搭建

3.1 依赖Jar包

<?xml version="1.0"?>
<project
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"
	xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>cn.pomit</groupId>
		<artifactId>SpringWork</artifactId>
		<version>0.0.1-SNAPSHOT</version>
	</parent>
	<artifactId>Web</artifactId>
	<packaging>war</packaging>
	<name>Web</name>
	<url>http://maven.apache.org</url>
	<dependencies>
		<dependency>
			<groupId>org.springframework</groupId>
			<artifactId>spring-core</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework</groupId>
			<artifactId>spring-web</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework</groupId>
			<artifactId>spring-webmvc</artifactId>
		</dependency>
		<dependency>
			<groupId>org.apache.logging.log4j</groupId>
			<artifactId>log4j-api</artifactId>
		</dependency>

		<!--log4j-core -->
		<dependency>
			<groupId>org.apache.logging.log4j</groupId>
			<artifactId>log4j-core</artifactId>
		</dependency>

		<!-- log4j-web -->
		<dependency>
			<groupId>org.apache.logging.log4j</groupId>
			<artifactId>log4j-web</artifactId>
		</dependency>

		<dependency>
			<groupId>com.fasterxml.jackson.core</groupId>
			<artifactId>jackson-annotations</artifactId>
		</dependency>
		<dependency>
			<groupId>com.fasterxml.jackson.core</groupId>
			<artifactId>jackson-core</artifactId>
		</dependency>
		<dependency>
			<groupId>com.fasterxml.jackson.core</groupId>
			<artifactId>jackson-databind</artifactId>
		</dependency>

		<dependency>
			<groupId>cn.pomit</groupId>
			<artifactId>Ehcache</artifactId>
			<version>${project.version}</version>
		</dependency>
	</dependencies>
	<build>
		<finalName>Web</finalName>
	</build>
</project>

父pom管理了所有依赖jar包的版本,地址:

https://www.pomit.cn/spring/SpringWork/pom.xml

3.2 web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
	version="3.0">
	<display-name>springwork-main</display-name>
	<listener>
		<listener-class>org.apache.logging.log4j.web.Log4jServletContextListener</listener-class>
	</listener>

	<filter>
		<filter-name>log4jServletFilter</filter-name>
		<filter-class>org.apache.logging.log4j.web.Log4jServletFilter</filter-class>
	</filter>
	<filter-mapping>
		<filter-name>log4jServletFilter</filter-name>
		<url-pattern>/*</url-pattern>
		<dispatcher>REQUEST</dispatcher>
		<dispatcher>FORWARD</dispatcher>
		<dispatcher>INCLUDE</dispatcher>
		<dispatcher>ERROR</dispatcher>
	</filter-mapping>
	<listener>
		<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
	</listener>
	<context-param>
		<param-name>contextConfigLocation</param-name>
		<param-value>classpath:applicationContext.xml</param-value>
	</context-param>
	<filter>
		<filter-name>characterEncodingFilter</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>
		<init-param>
			<param-name>forceEncoding</param-name>
			<param-value>true</param-value>
		</init-param>
	</filter>
	<filter-mapping>
		<filter-name>characterEncodingFilter</filter-name>
		<url-pattern>/*</url-pattern>
	</filter-mapping>

	<!-- Spring Security 的过滤配置,表明请求需要经过这个类的过滤和判断 -->
<!-- 	<filter> -->
<!-- 		<filter-name>springSecurityFilterChain</filter-name> -->
<!-- 		<filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class> -->
<!-- 	</filter> -->
<!-- 	<filter-mapping> -->
<!-- 		<filter-name>springSecurityFilterChain</filter-name> -->
<!-- 		<url-pattern>/*</url-pattern> -->
<!-- 	</filter-mapping> -->

	<servlet>
		<servlet-name>springDispatcherServlet</servlet-name>
		<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
		<init-param>
			<param-name>contextConfigLocation</param-name>
			<param-value>classpath:spring-servlet.xml</param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>springDispatcherServlet</servlet-name>
		<url-pattern>/</url-pattern>
	</servlet-mapping>
	<welcome-file-list>
		<welcome-file>index.html</welcome-file>
	</welcome-file-list>
</web-app>

3.3 Spring配置

applicationContext.xml是Spring的配置文件。

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:aop="http://www.springframework.org/schema/aop"
	xmlns:tx="http://www.springframework.org/schema/tx" 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/tx 
                    http://www.springframework.org/schema/tx/spring-tx.xsd
                    http://www.springframework.org/schema/aop 
                    http://www.springframework.org/schema/aop/spring-aop.xsd
                    http://www.springframework.org/schema/context      
                    http://www.springframework.org/schema/context/spring-context.xsd">

	<context:annotation-config />
	<context:component-scan base-package="cn.pomit.springwork">
	</context:component-scan>
	
	<import resource="classpath*:spring-mybatis.xml"/>
	<import resource="classpath*:spring-ehcache.xml"/>
</beans>

这个配置文件里可以写入一些bean的配置。

Spring是一个大的父容器,Spring Mvc是其中的一个子容器。父容器不能访问子容器对象,但是子容器可以访问父容器对象。 因此,bean的配置要写到这个文件中,而不是Spring Mvc的配置文件中。

3.4 Spring Mvc配置

spring-servlet.xml是Springmvc的配置文件

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:mvc="http://www.springframework.org/schema/mvc" 
	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 
                http://www.springframework.org/schema/mvc 
                http://www.springframework.org/schema/mvc/spring-mvc.xsd">

	<context:annotation-config />
	<context:component-scan base-package="cn.pomit.springwork" use-default-filters="false">
		<context:include-filter type="annotation" expression="org.springframework.stereotype.Controller" />
		<context:include-filter type="annotation" expression="org.springframework.web.bind.annotation.RestController" />
	</context:component-scan>
	<bean
		class="org.springframework.web.servlet.view.InternalResourceViewResolver">
		<property name="prefix" value="" />
	</bean>


	<mvc:annotation-driven>
		<mvc:message-converters>
			<bean
				class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
				<property name="supportedMediaTypes">
					<list>
						<value>application/json;charset=UTF-8</value>
					</list>
				</property>
			</bean>
		</mvc:message-converters>
	</mvc:annotation-driven>

	<mvc:resources location="/img/" mapping="/img/**" />
	<mvc:resources location="/css/" mapping="/css/**" />
	<mvc:resources location="/js/" mapping="/js/**" />
	<mvc:default-servlet-handler/>
</beans>

Spring是一个大的父容器,Spring Mvc是其中的一个子容器。父容器不能访问子容器对象,但是子容器可以访问父容器对象。 因此,bean的配置要写到这个文件中,而不是Spring Mvc的配置文件中。

<context:include-filter>:

  • 这里是配置Spingmvc只扫描Controller和RestController注解,避免和Spring扫描过程冲突。
  • 惨痛教训:不隔离开两个包扫描的过程,会导致@Scheduled注解执行两次,而且注解使用的缓存会失效。

3.5 log4j配置

<?xml version="1.0" encoding="UTF-8"?>
<Configuration status="OFF" monitorInterval="1800">
    <properties>
        <property name="LOG_HOME">D:/log/SpringWorkLog</property>
        <property name="FILE_NAME">SpringWorkLog</property>
    </properties>
 
 
    <Appenders>
        <Console name="Console" target="SYSTEM_OUT">
            <PatternLayout pattern="%d{HH:mm:ss.SSS} [%t] %-5level %logger{36} - %msg%n" />
        </Console>
 
        <RollingFile name="running-log" fileName="${LOG_HOME}/${FILE_NAME}.log"
            filePattern="${LOG_HOME}/$${date:yyyy-MM}/${FILE_NAME}-%d{yyyy-MM-dd}-%i.log.gz"
            immediateFlush="true">
            <PatternLayout
                pattern="%date{yyyy-MM-dd HH:mm:ss.SSS} %level [%thread][%file:%line] - %msg%n" />
            <Policies>
                <TimeBasedTriggeringPolicy />
                <SizeBasedTriggeringPolicy size="10 MB" />
            </Policies>
            <DefaultRolloverStrategy max="20" />
        </RollingFile>
    </Appenders>
    <Loggers>
 
<!--         <Logger name="com.cssweb.test.app" level="trace" additivity="true">  -->
<!--             <AppenderRef ref="running-log" />  -->
<!--         </Logger> -->
 
        <Root level="debug">
               <!-- 这里是输入到文件,很重要-->
            <AppenderRef ref="running-log" />
            <!-- 这里是输入到控制台-->
            <AppenderRef ref="Console" />
        </Root>
    </Loggers>
</Configuration>

四、测试代码

4.1 简单的Controller

WebController:

package cn.pomit.springwork.web.endpoint;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

@Controller
@RequestMapping("/web")
public class WebController {

	@RequestMapping(value = "/json", method = { RequestMethod.GET })
	public String welCome() {

		return "redirect:/json.html";
	}
}

4.2 简单的RestController

RestController提供rest服务,一般都是提供json数据的。

WebRest:

package cn.pomit.springwork.web.endpoint;

import java.util.UUID;

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import cn.pomit.springwork.web.entity.WelEntity;


@RestController
@RequestMapping("/pub")
public class WebRest {
	
	@RequestMapping(value = "/welCome", method = { RequestMethod.GET })
	public WelEntity welCome(@RequestParam(value = "reqType", required = false) String reqType) {
		String uuid = UUID.randomUUID().toString();
		String welMsg = "welcome 程序猿";
		if(reqType != null && "1000".equals(reqType)){
			welMsg = "welcome 程序媛";
		}
		WelEntity welEntity = new WelEntity();
		welEntity.setUuid(uuid);
		welEntity.setWelMsg(welMsg);
		return welEntity;
	}
}

4.3 实体

WelEntity:

package cn.pomit.springwork.web.entity;

public class WelEntity {
	private String uuid;
	private String welMsg;
	private String dateTime;
	public String getUuid() {
		return uuid;
	}
	public void setUuid(String uuid) {
		this.uuid = uuid;
	}
	public String getWelMsg() {
		return welMsg;
	}
	public void setWelMsg(String welMsg) {
		this.welMsg = welMsg;
	}
	public String getDateTime() {
		return dateTime;
	}
	public void setDateTime(String dateTime) {
		this.dateTime = dateTime;
	}
}

4.4 前端配合

json.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta name="keywords" content="HTTP请求工具">
    <meta name="description" content="HTTP请求工具">
    <title>HTTP请求工具</title>

    <!-- CSS  -->
    <link href="https://lib.baomitu.com/material-design-icons/3.0.1/iconfont/material-icons.min.css" rel="stylesheet">
    <link href="./css/json.css" rel="stylesheet">    
    <link href="https://lib.baomitu.com/materialize/0.100.2/css/materialize.min.css" type="text/css" rel="stylesheet" media="screen,projection"/>
	<script src="./js/json.js?v=129"></script>
     <style>
	/* Custom Stylesheet */
        /**
         * Use this file to override Materialize files so you can update
         * the core Materialize files in the future
         *
         * Made By MaterializeCSS.com
         */

        body{
        	background: #fff6f6
        }

        p {
            line-height: 2rem;
        }

        .button-collapse {
            color: #26a69a;
        }

        .parallax-container {
            min-height: 380px;
            line-height: 0;
            height: auto;
            color: rgba(255,255,255,.9);
        }
        .parallax-container .section {
            width: 100%;
        }

        @media only screen and (max-width : 992px) {
            .parallax-container .section {
                position: absolute;
                top: 40%;
            }
            #index-banner .section {
                top: 10%;
            }
        }

        @media only screen and (max-width : 600px) {
            #index-banner .section {
                top: 0;
            }
        }

        .icon-block {
            padding: 0 15px;
        }
        .icon-block .material-icons {
            font-size: inherit;
        }

        footer.page-footer {
            margin: 0;
        }
        
        .token.punctuation {
		    color: #999;
		}
		.bar-active{
			background: #f5c2c2b3;
		}
		.bar-doc{
			background-color: #f7a1a1;
		}
		.center-block{
			display: block;
			margin-left: auto;
			margin-right: auto;
			text-align: -webkit-center;
		}
		.searchInput{
		    display: block;
		    width: 100%;
		    height: 34px;
		    padding: 6px 12px;
		    font-size: 14px;
		    line-height: 1.42857143;
		    color: #555;
		    background-color: #fff;
		    background-image: none;
		    border: 1px solid #ccc;
		    border-radius: 4px;
		    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
		    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
		    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
		    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
		    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
		}
		td{
			padding: 10px 5px !important;
		}
    </style>
</head>
<body>

<!-- content -->
<div class="section no-pad-bot">
    <div class="container">
        <div class="row center">
	        <span class="teal-text text-lighten-2 center" style="font-size: 1.5em;font-weight:bold;color: #112f6b!important;">发送HTTP请求</span>
        </div>
    </div>
</div>
<div class="divider"></div>
<div >
    <div class="container">

        <!-- main info -->
       	<div class="row">
        	<blockquote>
			      请求数据:
			</blockquote>
        	<div id="rootInputData">
				<textarea class="z-depth-1" id="RawJson" style="resize:none; height: 15rem; background-color: white" ></textarea>
			</div>
        </div>
        <div class="row">
		    <div class="col s4" >
		    	 <div class="switch">
				    <label>
				      GET
				      <input type="checkbox" id="second_switch_dst" checked>
				      <span class="lever"></span>
				      POST
				    </label>
				  </div>
		    </div>
		    <div class="col s8" >	
			  <form action="#">
			      <input name="group1" type="radio" value=1 id="getParam" />
			      <label for="getParam">Params</label>

			      <input class="with-gap" name="group1" type="radio" value=2 id="jsonRadio" />
			      <label style="margin-left:30px" for="jsonRadio">JSON</label>

			      <input class="with-gap" name="group1" type="radio" value=3 id="formdata"  />
			      <label style="margin-left:30px" for="formdata">form-data</label>

			      <input class="with-gap" name="group1" type="radio" value=4 id="urlencoded"  />
			      <label style="margin-left:30px" for="urlencoded">x-www-form-urlencoded</label>
			  </form>
		    </div>
		</div>
		<div class="row">
		    <div class="left valign-wrapper" style="height:34px"><span class="control-label right">http://127.0.0.1:8380/api/</span></div>
		    <div class="left"><input type="text" class="browser-default searchInput left" id="inputUrl" ></div>
		</div>
		<div class="row" style="margin-top:30px">
	        <button type="button" class="waves-effect  lighten-2 waves-light btn" onclick="prism()">格式化</button>
	        <button type="button" class="waves-effect red lighten-2 waves-light btn" style="margin-left:30px" onclick="postForResult()">发送请求</button>
	        <button type="button" class="waves-effect blue darken-2 lighten-2 waves-light btn" style="margin-left:30px" onclick="saveSnapshot()">保存快照</button>
	        <button type="button" class="waves-effect  green darken-1 lighten-2 waves-light btn" style="margin-left:30px" onclick="javascript:$('#inputJsonFile').click()">加载快照</button>
	        <input type="file" class="waves-effect red lighten-2 waves-light btn" style="margin-left:30px;display:none" id="inputJsonFile" onchange="loadSnapshot(this.files)"/>
        </div> 
		<div>
        	<blockquote>
			     响应结果:
			</blockquote>
        	<div>
				<div class="z-depth-1" id="Canvas" style="resize:none; height: 15rem;overflow:auto;margin-bottom:0px;background-color: white" >
					
				</div>
			</div>
        </div>
    </div>
</div>

<!-- content -->
<div class="section no-pad-bot">
    <div class="container">
    	<div class="row">
		</div>  
    </div>
</div>

</body>

<script src="https://lib.baomitu.com/jquery/3.3.0/jquery.min.js"></script>
<script src="https://www.pomit.cn/js/FileSaver.min.js"></script>
<script src="https://lib.baomitu.com/materialize/0.100.2/js/materialize.min.js"></script>
<script>
	function postForResult(){
		var httpType = "POST";
		var ischecked = $("#second_switch_dst").prop("checked");
		var val=$('input:radio[name="group1"]:checked').val();
        if(val==null){
            alert("什么也没选中!");
            return;
        }
		if(!ischecked){
			httpType = "GET";
			
			httpForResult(httpType);
		}else{
			if(val == 2){
				postJsonForResult();
			}else{
				httpForResult(httpType);
			}
		}
		
	}
	function addRow(){
	    var oTable = document.getElementById("oTable");
	    var tBodies = oTable.tBodies;
	    var tbody = tBodies[0];
	    var rowNumm = tbody.rows.length;
	    var tr = tbody.insertRow(rowNumm);
	    var td_1 = tr.insertCell(0);
	    td_1.innerHTML = "<div contenteditable='true'>第1列</div>";
	    var td_2 = tr.insertCell(1);
	    td_2.innerHTML = "<div contenteditable='true'>第2列</div>";
	    var td_3 = tr.insertCell(2);
	    td_3.innerHTML = `<input type="checkbox" id="checkbox${rowNumm}" checked="checked" />
      		<label for="checkbox${rowNumm}"></label>`;
	    var td_4 = tr.insertCell(3);
	    td_4.innerHTML = `<a style="cursor:pointer" onclick="deleteRow(this);"><i class="material-icons">delete</i></a>`;
	}
	function deleteRow(domid){
		$(domid).parent().parent().remove(); 
	}
    $(function () {
    	$("#second_switch_dst").change(function() { 
        	var ischecked = $(this).prop("checked");
        	if(ischecked){
        		$("#jsonRadio").removeAttr("disabled");
        		$("#formdata").removeAttr("disabled");
        		$("#urlencoded").removeAttr("disabled");
        	}else{
        		$("#getParam").attr("checked",true);
        		$("#rootInputData").html(`
    					<div class="z-depth-1" id="RawJson" style="resize:none; height: 15rem;overflow:auto;margin-bottom:0px;background-color: white" >
    			<table class="left" id="oTable" style="background-color:#eeeeee;width: 70%; table-layout:fixed;" bordercolor="#aaaaaa" border="1" cellpadding="0" cellpadding="2" width="60%">
    			<thead>
    			<tr>
    			<th>key</th>
    			<th>value</th>
    			<th>是否传输</th>
    			<th>操作</th>
    			</tr>
    			</thead>
    			<tbody id="tableBody">
    			<tr>
    			<td style="padding: 10px 5px;"><div contenteditable="true">test</div></td>
    			<td style="padding: 10px 5px;"><div contenteditable="true">test</div></td>
    			<td style="padding: 10px 5px;"> 
			      		<input type="checkbox" id="checkbox0" checked="checked" />
			      		<label for="checkbox0"></label>
			    </td>
    			<td style="padding: 10px 5px;"><a style="cursor:pointer" onclick="deleteRow(this);"><i class="material-icons">delete</i></a></td>
    			</tr>
    			</tbody>
    			</table>
    			<div class="right">
    	        	<button type="button" class="waves-effect  green darken-1 lighten-2 waves-light btn" style="margin-left:30px" onclick="addRow();">添加一行</button>
    	        </div>
				</div>
    					`);

        		$("#jsonRadio").attr("disabled","disabled");
        		$("#formdata").attr("disabled","disabled");
        		$("#urlencoded").attr("disabled","disabled");
        		
        	}
       	});

    	$('input:radio[name="group1"]').click(function(){
    		var checkValue = $(this).val(); 
    		if(checkValue == 1 || checkValue == 4){
    			$("#rootInputData").html(`
    					<div class="z-depth-1" id="RawJson" style="resize:none; height: 15rem;overflow:auto;margin-bottom:0px;background-color: white" >
    			<table class="left" id="oTable" style="background-color:#eeeeee;width: 70%; table-layout:fixed;" bordercolor="#aaaaaa" border="1" cellpadding="0" cellpadding="2" width="60%">
    			<thead>
    			<tr>
    			<th>key</th>
    			<th>value</th>
    			<th>是否传输</th>
    			<th>操作</th>
    			</tr>
    			</thead>
    			<tbody id="tableBody">
    			<tr>
    			<td style="padding: 10px 5px;"><div contenteditable="true">test</div></td>
    			<td style="padding: 10px 5px;"><div contenteditable="true">test</div></td>
    			<td style="padding: 10px 5px;"> 
    		      		<input type="checkbox" id="checkbox0" checked="checked" />
    		      		<label for="checkbox0"></label>
    		    </td>
    			<td style="padding: 10px 5px;"><a style="cursor:pointer" onclick="deleteRow(this);"><i class="material-icons">delete</i></a></td>
    			</tr>
    			</tbody>
    			</table>
    			<div class="right">
    	        	<button type="button" class="waves-effect  green darken-1 lighten-2 waves-light btn" style="margin-left:30px" onclick="addRow();">添加一行</button>
    	        </div>
				</div>
    					`);
    		}else{
    			$("#rootInputData").html(`
    					<textarea class="z-depth-1" id="RawJson" style="resize:none; height: 15rem; background-color: white" ></textarea>
    					`);
    		}
    	});
    });
</script>
</html>

详细完整代码,可以在Spring组件化构建中选择查看,并下载。

快速构建项目

Spring组件化构建

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券