导航到单击按钮的页面 [英] Navigate to a page on button click

问题描述

我在这里有一个按钮.

<button type="button">@item.StepsToList steps to list</button>

我希望按钮转到类似于我下面的操作的页面.

I want the button to go to the page similar to my action below.

/ManageSpaces/id/概述

/ManageSpaces/id/Overview

我正在尝试通过将操作链接放在按钮内来实现此目的.

I'm trying to do this by putting this action link inside the button.

@Html.ActionLink("Manage Yoga Space and Calendar", "Overview", new {controller = "ManageSpaces", action = "Overview", id = item.YogaSpaceId })

如何使上面的操作链接在 button 标记内起作用?

How to make the action link above work inside the button tag?

推荐答案

按钮不用于导航.这就是超链接的用途.将非锚< a> 放在< button> 内也是无效的.如果您将重点放在按钮的外观上，则选择

Buttons aren't for navigation. That's what hyperlinks are for. Putting a non-anchor <a> inside of a <button> isn't valid, either. If your focus is on the look of a button, your choices are to

• 使用按钮.捕获点击事件并使用window.location或
导航页面
• 使用超链接.添加一个CSS框架(例如Bootstrap或Foundation)，并应用其按钮样式之一.

假设您对jQuery完全熟悉，那么类似的方法在前一点上是可行的:

Assuming you're familiar with jQuery at all, something like this works for the former point:

<button class="link-button" data-url="/some/url">I navigate somewhere</button>

<script>
    $('.link-button').on('click', function(e) {
        window.location = $(this).data('url');
    });
</script>

对于后一点，Bootstrap和Foundation都有专用的样式，可以使几乎任何东西看起来像按钮":

For the latter point, Bootstrap and Foundation both have dedicated styles for making just about anything look like a "button":

<a href="/some/url" class="btn btn-default">I navigate somewhere</a>

基金会

<a href="#" class="button">I navigate somewhere</a>

这篇关于导航到单击按钮的页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！