springboot项目创建链接 https://blog.csdn.net/q18771811872/article/details/88126835

springboot2.0 跳转jsp教程 https://blog.csdn.net/q18771811872/article/details/88342298

jsp+html跳转整合 https://blog.csdn.net/q18771811872/article/details/88343672

springboot 成功创建了后，继续写一下跳转到html页面的方法,  这里我把 jsp和html 分开两篇文章。然后再写一个两种方式整合的

这篇 是跳转到html文件的

1创建目录结果和html文件

​

2配置return 返回模版

​

3.UserController.java代码如下，这里就直接使用上次创建的查询方法

@RequestMapping(value = "/testHtml", produces = "application/json;charset=UTF-8", method = {RequestMethod.POST, RequestMethod.GET})

    public String testHtml(Model m, HttpServletRequest request, HttpServletResponse response){

        List<Map<String,Object>> list=userService.userQueryAll();

        request.setAttribute("list",list);

        log.info("进入了testHtml方法！");

        return "views/testHtml";

    }

4.application.yml 文件 配置 thymeleaf 模版参数

​

spring:

  dataSource:

    type: com.alibaba.druid.pool.DruidDataSource

    url: jdbc:mysql://localhost:3306/db-test?useUnicode=true&characterEncoding=utf8&tinyInt1isBit=false&usessl=false

    username: root

    password: 123456

    driverClassName: com.mysql.jdbc.Driver

  thymeleaf:

    #清除缓存

    cache: false

    mode: LEGACYHTML5 #非严格模式

    prefix: /WEB-INF/ #默认 classpath:/templates/

    suffix: .html

    servlet:

      content-type: text/html

5. pom.xml 文件加入thymeleaf 架包

        <dependency>

            <groupId>org.springframework.boot</groupId>

            <artifactId>spring-boot-starter-thymeleaf</artifactId>

        </dependency>

        <!--非严格模式下 规避一些html编译错误 -->

        <dependency>

            <groupId>net.sourceforge.nekohtml</groupId>

            <artifactId>nekohtml</artifactId>

            <version>1.9.22</version>

        </dependency>

6. html页面这里我为了方便事先引入了jQuery ，并且直接使用了thymeleaf 模版来接收数据，也是第一次用。

<!DOCTYPE html>

<html lang="ch" xmlns:th="http://www.springframework.org/schema/mvc">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<input th:value="${list[0][create_time]}">

<table border="1">

</table>

</body>

<script src="/static/js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>

<script th:inline="javascript" type="text/javascript" charset="utf-8">

    /**

     *

     * 在html标签中 使用  th:value、th:text 来获取数据

     *  例

     *  <input th:value="${list2[0][create_time]}">

     * @type {Array[]}

     */

    console.log(JSON.stringify([[${list}]]));

    var list = ([[${list}]]);

    tableAppend(list)

    function tableAppend() {

        var table_html=`

        <tr>

        <th>序号</th>

        <th>名字</th>

        <th>号码</th>

        <th>创建时间</th>

        </tr>`;

        for(var i=0;list.length>i;i++){

            table_html += `

        <tr>

            <td>${list[i]['id']}</td>

            <td>${list[i]['name']}</td>

            <td>${list[i]['phone']}</td>

            <td>${list[i]['create_time']}</td>

        </tr>`;

        }

        $("table").append(table_html);

    }

</script>

</html>

7. Project Structure里面 这个一般是默认配置好了的，如果没有就要加上哦

​

就这样启动就行了  效果图如下

​

springboot项目创建链接 https://blog.csdn.net/q18771811872/article/details/88126835

springboot2.0 跳转jsp教程 https://blog.csdn.net/q18771811872/article/details/88342298

jsp+html跳转整合 https://blog.csdn.net/q18771811872/article/details/88343672

原文地址: https://blog.csdn.net/q18771811872/article/details/88312862

springboot 2.0.8 跳转html页面的更多相关文章

  1. springboot 2.0.8 跳转jsp页面

    springboot项目创建教程 https://blog.csdn.net/q18771811872/article/details/88126835 springboot 2.0跳转 html教程 ...

  2. vue2.0 页面A跳转到页面B，B页面停留在A页面的滚动位置的解决方法

    如果页面A沿Y轴滚动一段距离,然后跳转到页面B: 在进入B页面时,B页面已经滚到页面A的距离,返回页面A,发现A还在之前的滚动位置: 这样体验就很不好,所以我们要进行一些处理: 我的方法是:在路由守卫 ...

  3. 一步一步实现web程序信息管理系统之二----后台框架实现跳转登陆页面

    SpringBoot springboot的目的是为了简化spring应用的开发搭建以及开发过程.内部使用了特殊的处理,使得开发人员不需要进行额外繁锁的xml文件配置的编写,其内部包含很多模块的配置只 ...

  4. SpringBoot从0到0.7——第四天

    SpringBoot从0到0.7--第四天 今天进行实战开发一个小项目,SpringBoot和Thymeleaf集成的小项目 因为懒得写写前端,直接找的别人的项目在它的的基础上进行配置,进行修改.gi ...

  5. JS实现跳转到页面任何地方

    要实现两个内容: 1.从A页面跳转到B页面任何地方 方法:用id对要跳转的地方进行标记. 首先,在A页面可以设一个链接 <a href = "b.html#pos" targ ...

  6. 登录超时，给出提示跳到登录页面（ajax、导入、导出）

    一.一般页面登录超时验证,可以用过滤器filter,如下: package com.lg.filter; import java.io.IOException; import javax.servle ...

  7. 网页调试技巧：抓取马上跳转的页面POST信息或者页面内容

    http://www.qs5.org/Post/625.html 网页调试技巧:抓取马上跳转的页面POST信息或者页面内容 2016/02/02 | 心得分享 | 0 Replies 有时候调试网页或 ...

  8. 一种基于自定义代码的asp.net网站首页根据IP自动跳转指定页面的方法！

    一种基于自定义代码的asp.net网站首页根据IP自动跳转指定页面的方法! 对于大中型网站,为了增强用户体验,往往需要根据不同城市站点的用户推送或展现相应个性化的内容,如对于一些大型门户网站的新闻会有 ...

  9. html锚点 点击跳转到页面指定位置

    本来是在看阮大神写的ajax教程,突然发现点击目录文字会跳转到相对应的文本内容,于是乎激发了我的兴趣. 这个究竟怎么做的,刚开始看的时候一知半解,找度娘就是:"点击跳转到页面指定位置&quo ...

随机推荐

  1. Not a git repository (or any of the parent directories): .git解决

    首先git init .然后在执行就行了.意思应该是当前目录不是git.

  2. IDEA配置好maven后新建maven项目一直build失败的解决方法

    maven配置了aliyun中央仓库后,IDEA新建maven项目一直出现以下问题: 相信有遇到这个问题的小伙伴很蛋疼,明明maven配置没错,新建项目却一直build失败,为了这个问题我重装过几次I ...

  3. 47.关于gradle的解疑

    Short Answer Gradle is a build system. Long Answer Before Android Studio you were using Eclipse for ...

  4. mate viewport

    <meta name="viewport" content="width=device-width,height=device-height,initial-sca ...

  5. 第一章：前端布局之display属性

    css布局学习网站:http://zh.learnlayout.com

  6. 第1章 HTML基础

    1.1 HTML概述 1.1.1 什么是HTML HTML(Hyper Text Markup Language,超 文本 标记 语言)是纯文本类型的语言,它是Internet上用于编写网页的主要语言 ...

  7. linux自动执行指令crontab和at

    目录 1 at和crontab指令 2 batch 一.at与crontab的区别 运行方式不同 at只运行一次,crontab循环运行 依赖的服务不同 at 对应的服务是 atd crontab 对 ...

  8. 多啦A梦的制作

    小叮当简单颜色单一,操作起来也很容易上手.接下来的一个实例就是用css画出一个多啦A梦,首先将其分为头部,和身体.然后,再根据身体各部分细节进行进一步的具体刻画. 由于最近一直在学习JavaWeb方面 ...

  9. char与byte的区别

    很多初学者(包括我,已经学了一年多java了)肯会对char和byte这两种数据类型有所疑惑,相互混淆,今天特地查了好多资料,对byte和char两种数据类型进行了总结和比较,先将结果与大家分享: b ...

  10. AngularJS实现TodoMVC

    一个小的to do list,界面如下 首先安装angular js,出现了无非安装到桌面的问题,安装到D盘了 npm install angular 文件结构: index.html: <!d ...