代码结构:

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 + thymeleaf

    代码结构: 1.ThymeleafController package com.xxx.firstboot.web; import org.springframework.stereotype.Con ...

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  9. 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类中的方法,又多此一举的单独整 ...

  10. 第十八章 DjangoWeb开发框架

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

随机推荐

  1. 洛谷P2059 卡牌游戏 [JLOI2013] 概率dp

    第一道期望题好像是?还是对这类题目的做法启发比较大的quqqqqq 正解:概率dp 解题报告: 先港下,学到的一个算是结论的玩意儿: 概率正推期望逆推 很多时候正推期望是很麻烦的,但是逆推回去就会,简 ...

  2. Python-OpenCV —— 基本操作详解

    OpenCV是一个基于BSD许可(开源)发行的跨平台计算机视觉库,可以运行在Linux.Windows.MacOS操作系统上.它轻量级而且高效——由一系列 C 函数和少量C++类构成,同时提供了Pyt ...

  3. AndroidStudio 3.3+ ButterKnife R2 红名问题

    如果你一直用着ButterKnife,但是用的低版本(比如用得很多的8.4.0),然后在多module项目中一定知道要把R改成R2 然后最近如果升级AndroidStudio了,升到3.3以上(201 ...

  4. 学习grunt四解决yo webapp生成的是gulpfile而不是gruntfile问题

    虽然gulp慢慢取代了gruntfile,但是还有大部分的github源码保留gruntfile,另外我们开发项目也不是全用gulp,也是用grunt. 但是yeoman上generator-weba ...

  5. OpenCV中PCA实现人脸降维

    前言: PCA是大家经常用来减少数据集的维数,同时保留数据集中对方差贡献最大的特征来达到简化数据集的目的.本文通过使用PCA来提取人脸中的特征脸这个例子,来熟悉下在oepncv中怎样使用PCA这个类. ...

  6. python接口自动化 -参数关联(一)

    原文地址https://www.cnblogs.com/yoyoketang/p/6886610.html 原文地址https://www.cnblogs.com/yoyoketang/ 原文地址ht ...

  7. http协议基础(三)几种数据传输方式

    说说http协议的一些特点: 1)无状态 http协议是一种自身不对请求和响应之间的通信状态进行保存的协议,即无状态协议. 这种设置的好处是:更快的处理更多的请求事务,确保协议的可伸缩性 不过随着we ...

  8. 删除排序数组中的重复数字 II

    题目连接 http://www.lintcode.com/zh-cn/problem/remove-duplicates-from-sorted-array-ii/ 题目大意 跟进“删除重复数字”: ...

  9. n是否是2的幂

    实例五:n是否是2的幂 方法一:result=n&(n-1) 如果result=0 则n是2的幂方法二:result=n&((~n)+1) 如果result=n 则n是2的幂 原数   ...

  10. ZOJ 3949 Edge to the Root

    题意: 在一棵树中,可以从根节点往其他节点加一条边,使得根节点到其他所有节点的距离和最小,输出最小的距离和. 思路: 我们考虑在加的一条边为$1 \to v$,那么在树上从$1 \to v$的路径上, ...