c# - 如何使用 jquery mobile 在 mvc 中使用 @Html.ActionLink 创建计数气泡

Question

我使用 jquery mobile 在 mvc4 的按钮中创建了 Count bubble。代码下方

<a href="url.html" class="ui-li-has-count" data-role="button"  data-ajax="false" data-mini="true" style="background-color:#52616D;color:white">
 DK-02<span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style="background-color:white;color:#52616D">11</span></a>

给予

现在如何使用@Html.ActionLink razor 语法创建外观相似的按钮？

 @Html.ActionLink("DK-02","test","home")

已更新

在你们的帮助下，我解决了 80% 的问题。我所做的是

<div class="ui-grid-c">
    @for (int j = 1; j < myPutaway.Count + 1; j++)
    {
        if **(j == 1)**
        {
        <div class="ui-block-a">
            <a href="@Url.Action("test", "DirectPutaway")" class="ui-li-has-count" data-role="button"  data-ajax="false" data-mini="true" style="background-color:#52616D;color:white">
                @myPutaway[j].ReceivingLane.ToString() <span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style="background-color: white; color: #52616D">@myPutaway[j].NoOfMuf.ToString() </span></a>
        </div>
        }
        else if **(j == 2)**
        {
        <div class="ui-block-b">
            <a href="@Url.Action("test", "DirectPutaway")" class="ui-li-has-count" data-role="button"  data-ajax="false" data-mini="true" style="background-color:#52616D;color:white">
                @myPutaway[j].ReceivingLane.ToString() <span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style="background-color: white; color: #52616D">@myPutaway[j].NoOfMuf.ToString()</span></a>
        </div>
        }
        else if **(j == 3)**
        {
        <div class="ui-block-c">
            <a href="@Url.Action("test", "DirectPutaway")" class="ui-li-has-count" data-role="button"  data-ajax="false" data-mini="true" style="background-color:#52616D;color:white">
                @myPutaway[j].ReceivingLane.ToString() <span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style="background-color: white; color: #52616D">@myPutaway[j].NoOfMuf.ToString()</span></a>
        </div>
        }
        else if **(j == 4)**
        {
        <div class="ui-block-d">
            <a href="@Url.Action("test", "DirectPutaway")" class="ui-li-has-count" data-role="button"  data-ajax="false" data-mini="true" style="background-color:#52616D;color:white">
                @myPutaway[j].ReceivingLane.ToString() <span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style="background-color: white; color: #52616D">@myPutaway[j].NoOfMuf.ToString()</span></a>
        </div>
        }
    }
</div>

我明白了，但我硬编码 j==1,2,3,4 来设置 css 类，，，这需要显示 4*4 网格。但不是硬编码我如何让它变得动态。所以我的第一个值将获得 A 类和第二类 B..etc

Answer 1

您必须使用 @Url.Action 将 url 放入 a 的 href 属性中:

<a href='@Url.Action("test","home")' class="ui-li-has-count" data-role="button"  data-ajax="false" data-mini="true" style="background-color:#52616D;color:white">
DK-02
<span class="ui-li-count ui-btn-up-c ui-btn-corner-all" style="background-color:white;color:#52616D">11</span>
</a>

或者如果您只想使用 Html 帮助程序方法，那么您必须编写自己的自定义 Html 帮助程序。

您可以在这个 tutorial 中看到如何创建