Thymeleaf:如何使按钮链接到另一个 html 页面?

Posted

技术标签:

【中文标题】Thymeleaf:如何使按钮链接到另一个 html 页面?【英文标题】:Thymeleaf: How to make a button link to another html page? 【发布时间】:2018-02-23 06:18:11 【问题描述】:

我的 html 页面中有一个输入按钮。我想用 thymeleaf 将按钮链接到另一个 html 页面。这是我的代码。

<form id="hotDealForm" th:action="@/hot-deal-step-1">
    <div class="col-xs-12 col-sm-6 col-md-6">
        This Hot deal
        <br/>
        <input type="button" value="Continue to schedule" class="btn btn-red"/>
    </div>
</form>

我的控制器工作正常。 (我正在使用spring mvc)。但我无法弄清楚问题是什么。我可以使用 html 完成相同的任务。但是当我使用百里香时它不起作用。那是当我点击按钮时没有任何反应。

【问题讨论】:

【参考方案1】:

将方法添加为“post”解决了问题

<form id = "hotDealForm" th:action = "@/hot-deal-step-1"  method="post">

    <div class="col-xs-12 col-sm-6 col-md-6">
        This Hot deal
        <br/>
    <input type="button" value="Continue to schedule" class="btn btn-red" />
    </div>

</form>

【讨论】:

【参考方案2】:

嗨!

有很多方法可以做,但我发现最简单的方法是为链接提供一个按钮类,如下例所示。由于此类是引导程序的类,因此您需要参考引导程序。 由于您使用的是 MVC,因此它已经链接了 Bootstrap。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>

   
 <a href="@Url.Action("Index")" class="btn btn-success"> <i class="fa fa-arrow-circle-o-left"></i>&nbsp;Back to List</a>

下一步您可以执行以下操作:

@using (Html.BeginForm("Index", "Home", FormMethod.Post))

<input type="submit" value="Go To Dashboard" />

在首页索引中你可以这样做:

public ApplicationUserManager UserManager
    
      return RedirectToAction("Index","Dashboard",newarea="Admin")
    

【讨论】:

以上是关于Thymeleaf:如何使按钮链接到另一个 html 页面?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 jQuery 或仅使用 Javascript 将按钮重定向到另一个页面

如何替换 thymeleaf 链接中的 URL 参数?

如何使按钮将我的页面重定向到另一个页面? [复制]

如何使用 Thymeleaf 将 html 文件包含到另一个 html 文件中

如何在不发送错误的情况下使按钮转到另一个视图控制器?

按下按钮并成功重定向到另一个页面后,如何禁用导航栏链接?