代码结构:

1、ThymeleafController

 package com.xxx.firstboot.web;

 import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
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.ResponseBody; import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation; @Api("测试Thymeleaf和devtools")
@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafController { @ApiOperation("第一个thymeleaf程序")
@RequestMapping(value = "/greeting", method = RequestMethod.GET)
public String greeting(@RequestParam(name = "name", required = false, defaultValue = "world") String name,
Model model) {
model.addAttribute("xname", name);
return "index";
} @ApiOperation("thymeleaf ajax")
@ResponseBody
@RequestMapping(value = "/ajax", method = RequestMethod.GET)
public String ajax(@RequestParam("username") String username) {
return username;
} }

说明:

  • 第一个是springMVC经典返回形式modelAndView
  • 第二个是ajax返回形式

2、index.html

 <!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link th:href="@{/bootstrap/css/bootstrap.min.css}" rel="stylesheet"/>
<link th:href="@{/bootstrap/css/bootstrap-theme.min.css}" rel="stylesheet" />
</head>
<body>
<div class="panel panel-primary">
<div class="panel-heading">hello</div>
<div class="panel-body" th:text="${xname}"></div>
</div>
<div class="panel panel-warning">
<div class="panel-heading">hello</div>
<div id="usernamediv" class="panel-body"></div>
</div>
<script type="text/javascript" th:src="@{/js/jquery-1.11.1.js}"></script>
<script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
<script th:inline="javascript">
$(function(){
$.ajax({
url:"/thymeleaf/ajax",
data:{
username:"xxx"
},
type:"get",
dataType:"text",
success:function(text){
alert(text);
$("#usernamediv").text(text);
}
});
});
</script>
</body>
</html>

说明:

  • 引入外界静态资源的方式@{/xxx},默认的静态资源的根是"static"
  • ajax的返回类型dataType要选好(一般就是"text"/"json")
  • ajax的请求方法类型type要与controller相同,否则抛出405错误

文档:

第十八章 springboot + thymeleaf的更多相关文章

  1. 第二十八章 springboot + zipkin(brave定制-AsyncHttpClient)

    brave本身没有对AsyncHttpClient提供类似于brave-okhttp的ClientRequestInterceptor和ClientResponseInterceptor,所以需要我们 ...

  2. 第三十八章 springboot+docker(maven)

    回顾上一章的整个部署过程: 使用"mvn install"进行打包jar 将jar移动到与Dockerfile文件相同的文件夹下 编写Dockerfile文件 使用"do ...

  3. 不要再学 JSP 了,学 SpringBoot + Thymeleaf + Vue吧

    老读者就请肆无忌惮地点赞吧,微信搜索[沉默王二]关注这个在九朝古都洛阳苟且偷生的程序员.本文 GitHub github.com/itwanger 已收录,里面还有我精心为你准备的一线大厂面试题. 读 ...

  4. 《Linux内核设计与实现》读书笔记 第十八章 调试

    第十八章调试 18.1 准备开始          需要准备的东西: l  一个bug:大部分bug通常都不是行为可靠而且定义明确的 l  一个藏匿bug的内核版本:找出bug首先出现的版本 l  相 ...

  5. Python之路【第十八章】:Django基础

    Django基本配置 Python的WEB框架有Django.Tornado.Flask 等多种,Django相较与其他WEB框架其优势为:大而全,框架本身集成了ORM.模型绑定.模板引擎.缓存.Se ...

  6. 《Linux内核设计与实现》课本第十八章自学笔记——20135203齐岳

    <Linux内核设计与实现>课本第十八章自学笔记 By20135203齐岳 通过打印来调试 printk()是内核提供的格式化打印函数,除了和C库提供的printf()函数功能相同外还有一 ...

  7. 《Linux命令行与shell脚本编程大全》 第十八章 学习笔记

    第十八章:初识sed和gawk 文本处理 sed编辑器 sed编辑器可以基于输入到命令行的或是存储在命令文本文件中的命令来处理数据流中的数据. 它每次读取一行,用提供的编辑器命令匹配数据.按命令中指定 ...

  8. org.springframework.expression.spel.SpelEvaluationException: EL1004E: Method call: Method service() cannot be found on com.my.blog.springboot.thymeleaf.util.MethodTest type

    前言 本文中提到的解决方案,源码地址在:springboot-thymeleaf,希望可以帮你解决问题. 至于为什么已经写了一篇文章thymeleaf模板引擎调用java类中的方法,又多此一举的单独整 ...

  9. 第十八章 DjangoWeb开发框架

    第十八章 DjangoWeb开发框架 第一课 内容概要: 1.JS正则 -登录注册验证 2.组件 1.BootStrap -css -js 学习BootStrap规则 2.jQueryUI -css ...

随机推荐

  1. 实现linux和windows文件传输

    其实这个题目有点大,这里介绍的只是linux和windows文件传输中的一种,但是这种方法却非常实用,那就是:ZModem协议具体是linux命令是:rz和sz但是其实它们是两个非常方便的工具.   ...

  2. javacript 实现两个数组的差集

    <script type="text/javascript">      var array1 = [1,2,3,4,5,6,7,8,9];      var arra ...

  3. Am335x SPI 驱动测试

    内核版本:3.14.65 CPU:Am335x 1.编译内核: make menuconfig Device Drivers -> <*>SPI support -> < ...

  4. vsftp 虚拟用户+MySQL认证独立家目录

    centos7 系统 安装包 yum -y install mariadb vsftpd openssl-devel  mysql-devel  pam-devel yum -y groupinsta ...

  5. Openstack_通用模块_Oslo_vmware 创建 vCenter 虚拟机快照

    创建虚拟机快照 vSphere Create Snapshot 文档 Snapshot 是虚拟机磁盘文件(VMDK)在某个点及时的复本.包含了虚拟机所有虚拟磁盘上的数据状态和这个虚拟机的电源状态(on ...

  6. android httpUrlConnection HttpClient

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha httpUrlConnection    超文本传输协议统一资源定位器连接 http 超 ...

  7. Java 的类加载顺序

    Java 的类加载顺序 一.加载顺序:先父类后子类,先静态后普通 1.父类的静态成员变量初始化 2.父类的静态代码块 3.子类的静态成员变量初始化 4.子类的静态代码块 5.父类的普通成员变量初始化 ...

  8. BZOJ3207 花神的嘲讽计划

    hash值建主席树. 垃圾题面没有熟虑范围害我MLE——>RE. By:大奕哥 #include<bits/stdc++.h> #define unll unsigned long ...

  9. 牛可乐发红包脱单OI赛 C 小可爱表白

    打个暴力查一下OEIS,5min做完 出题人一开始把式子打错了,一开始的式子的结果为$n * (n + 3) * 2^{n - 3}$ 我们考虑化式子 首先考虑 $\sum\limits_{j = 1 ...

  10. 【推导】The 16th UESTC Programming Contest Preliminary L - Foxtrot

    题意:有n瓶药剂,其中只有一瓶药剂有毒.让你用最少的小白鼠试出哪瓶有毒.你只有一次给任意只小白鼠各喂食任意种类药剂的机会. m只老鼠就能对应2^m种“生死状态”的组合,给每种状态分配一个种类的药剂,然 ...