Question

我在SO和旧的Google搜索上看到了一些解决方案。然而，他们中的很多人似乎都在处理它被点击后被禁用的事实，或者如果它确实禁用了它，它保留了点击它的能力（实际上它只是变灰）。

我目前得到了以下代码，正如我所说，它会使ActionLink变灰，但仍然可以点击它。

$(function DisableEnableLink() {
    var addDiv = document.getElementById('addNewItemDiv');
    // items is determined by logic which checks different values on the page, I have removed this logic as it works fine and isn't necessarily connected to the rest of the query.  
    //It returns 0 if the logic finds no items, or 'X' if it does.  This will then determine whether the Action link is enabled or disabled.
    if ($('items').length > 0) {
        addDiv.disabled = true;
    } else {
        addDiv.disabled = false;
    }
});

我的ActionLink实际上包含在div内，因为我可以提供该ID。

<div id="addNewItemDiv">
    @Html.ActionLink("Add New Item", "Add");
</div>

如何修改我必须拥有的内容只显示文字？我无法在视图中使用if statement，因为我使用jquery填充数据，因此页面不会回发。

Answer 1

你可以这样做：

 @Html.ActionLink("Add New Item", "Add",new {id="Add"});

在您的Jquery代码中，

  if(check your condidtion here)
{
   $('Add').prop('disabled', true);
}

else
{
  $('Add').prop('disabled', false);

}

将ID设置为Helper并使用jquery的 PROP 方法启用/逐步删除链接

希望这会有所帮助..

注意： Diable链接不是整个div ..如果您需要这样做，只需用div的ID替换链接ID

<强> Updated2：

尝试使用CSS执行此操作

像这样添加一个CSS类：

.disableClick{
    pointer-events: none;
}

 @Html.ActionLink("Add New Item", "Add",new {id="Add",@class="disablelink"});

  if(your condidtion)
{
   $('#Add').addClass('disbaleClick');
}
else
{
   $(#Add).removeClass('disableClick');
}

Answer 2

您可以将css属性设置为：

pointer-events:none;

然后再次启用它，你可以设置 pointer-events:auto

 $(function DisableEnableLink() {
    var addDiv = document.getElementById('addNewItemDiv');
    if ($('items').length > 0) {
        addDiv.disabled = true;
        $('addDiv').css('pointer-events','none')
    } else {
        addDiv.disabled = false;
        $('addDiv').css('pointer-events','auto')
    }
});

使用jquery单击停止ActionLink

2 个答案: