从联系页面返回索引页面

Question

我有一个包含部分的长索引页面和一个联系页面，但问题是如果您转到联系页面并想要返回长索引页面，导航链接会损坏。

这是我的导航：

 <div class="collapse navbar-collapse">
                        <ul class="nav navbar-nav navbar-right">
                            <li><a href="#home" class="smoothScroll">HOME</a></li>
                            <li><a href="#about" class="smoothScroll">STUDIO</a></li>
                            <li><a href="#team" class="smoothScroll">TEAM</a></li>
                            <li><a href="#service" class="smoothScroll">SERVICES</a></li>
                            <li><a href="#work" class="smoothScroll">WORK</a></li>
                            <li><a href="#pricing" class="smoothScroll">PRICING</a></li>
                            @*<li><a href="#contact" class="smoothScroll">CONTACT</a></li>*@
                            <li>@Html.ActionLink("Contact", "Contact", "Home")
                            </li>
                        </ul>
                    </div>

所以如果您现在转到联系页面，网址将是：

http://localhost:53534/Home/Contact

但是如果你想从那里去例如：服务，你会得到 url：

http://localhost:53534/Home/Contact#service - what is not the correct url, because the correct url has to be:

http://localhost:53534/#service. So without the controller name contact.

但是如何管理呢？

谢谢

好吧，我试过了，像这样：

                           @Html.ActionLink( "Contact", "Contact"
                        , "Home"
                        , Request.Url.Scheme
                        , Request.Url.Host
                        , "contact"
                        , null
                        , null
                        )
                        </li>

但是，如果您再次从联系人转到其他链接，您将得到以下信息： http://localhost:53534/Home/Contact#pricing

我也试过这个：

                           @Html.ActionLink( "Contact", "Contact"
                        , "Home"
                        , Request.Url.Scheme
                        , Request.Url.Host
                        , ""
                        , null
                        , null
                        )
                        </li>

所以我的完整导航看起来像这样：

<div class="collapse navbar-collapse">
                        <ul class="nav navbar-nav navbar-right">
                            <li><a href="#home" class="smoothScroll">HOME</a></li>
                            <li><a href="#about" class="smoothScroll">STUDIO</a></li>
                            <li><a href="#team" class="smoothScroll">TEAM</a></li>
                            <li><a href="#service" class="smoothScroll">SERVICES</a></li>
                            <li><a href="#work" class="smoothScroll">WORK</a></li>
                            <li><a href="#pricing" class="smoothScroll">PRICING</a></li>

                            <li>

                               @Html.ActionLink( "Contact", "Contact"
                            , "Home"
                            , Request.Url.Scheme
                            , Request.Url.Host
                            , "contact"
                            , null
                            , null
                            )
                            </li>
                        </ul>
                    </div>

这是最新的：

<div class="collapse navbar-collapse">
                            <ul class="nav navbar-nav navbar-right">
                                <li><a href="#home" class="smoothScroll">HOME</a></li>
                                <li><a href="#about" class="smoothScroll">STUDIO</a></li>
                                <li><a href="#team" class="smoothScroll">TEAM</a></li>
                                <li><a href="#service" class="smoothScroll">SERVICES</a></li>
                                <li><a href="#work" class="smoothScroll">WORK</a></li>
                                <li><a href="#pricing" class="smoothScroll">PRICING</a></li>

                                <li>

                                   @Html.ActionLink( "Contact", "Contact"
                                , "Home"
                                , Request.Url.Scheme
                                , Request.Url.Host
                                , "contact"
                                , null
                                , null
                                )
                                </li>
                            </ul>
                        </div>

但随后链接将变为：http://localhost:53534/Home/Contact#pricing。它应该是：http://localhost:53534/Home/#pricing。

是的，好的，抱歉，发错了，但是：

                            @Html.ActionLink("Contact", "Index"
                            , "Home"
                            , Request.Url.Scheme
                            , Request.Url.Host
                            , "contact"
                            , null
                            , null
                            )
                        </li> The contact page has to be without "#". But now this is with "#". So how to omit the "#"? I just changed the first Index to Contact, because that is just the name

Answer 1

正如Stephen Muecke 在他的comment 中指出的那样，您可以使用Html.ActionLink 的重载。

@Html.ActionLink
( "Index"
, "Index"
, "Home"
, null
, null
, "contact" // the fragment
, null
, null
);

否则，您可以在 HTML 中使用常规锚 (a) 元素和 @Url.Action。您可以使用Url.Action 进入主页并从那里进一步导航：

<a href="@Url.Action("Index", "Home")#some_optional_hash" />