javascript - 将 Html 扩展与 ActionLink 结合使用

Question

我编写了一个 MVC5 Html 扩展来确定屏幕上的按钮是否被禁用。

如下:

public static HtmlString IsButtonEnabled(this HtmlHelper html, bool buttonEnabled)
{
  return new HtmlString(buttonEnabled ? "" : "disabled=\"disabled\"");
}

我的cshtml如下:

<div class="col-sm-12">
  <a class="btn btn-default btn-block btn-metro" @Html.IsButtonEnabled(Model.IsMyButtonEnabled)
     onclick="location.href='@Url.Action("Index","MyController")'">
    <img src="~/images/myImage.png"> <span class="h2">My Button</span>
  </a>
</div>

该按钮按预期被禁用 - 但是，由于使用 onclick 仍允许单击它。是否可以将我的 Html 扩展与 Html.ActionLink 一起使用？

我意识到我可以很容易地使用页面上的一些js来阻止点击 - 但是，如果可能的话，我想避免这种情况。

更新

扩展方法由屏幕上10个不同的按钮使用。为其中一个按钮生成的标记如下:

<div class="col-sm-12">
      <a class="btn btn-default btn-block btn-metro" disabled="disabled" href="/MyController/Index">
        <img src="/myApp/images/myImage.png"> <span class="h2">My Button</span>
      </a>
    </div>

根据下面的 Stephen 评论，我将单击更改为 href - 但是，即使该按钮被禁用，我仍然可以单击它，并且网站导航到指定的 url

Answer 1

您可以将“a”标签更改为“button”标签。 URL 标记并不意味着被禁用。

<div class="col-sm-12">
   <button class="btn btn-default btn-block btn-metro" @Html.IsButtonEnabled(Model.IsMyButtonEnabled)
 onclick="location.href='@Url.Action("Index","MyController")'">
       <img src="~/images/myImage.png"> <span class="h2">My Button</span>
    </button>
</div>