如何禁用UL内的特定LI元素？ [英] How can I disable a specific LI element inside a UL?

问题描述

我的菜单是< ul> 。每个菜单项都是< li> ，目前可点击。
根据某些条件，我想禁用（使其无法点击）特定的< li> 元素。
我怎样才能做到这一点？我尝试在< li> 和列表样式中使用已禁用属性：无。都没有奏效。有什么建议吗？

I have a menu which is a <ul>. Each menu item is a <li> and currently clickable. Based on some conditions, I want to disable (make it not clickable) a particular <li> element. How can I achieve this? I tried using the disabled attribute on the <li> and list-style:none as well. Neither worked. Any suggestions?

推荐答案

如果您仍想显示该项目，但仍然无法点击并使用CSS禁用该项目：

If you still want to show the item but make it not clickable and look disabled with CSS:

CSS：

.disabled {
    pointer-events:none; //This makes it not clickable
    opacity:0.6;         //This grays it out to look disabled
}

HTML：

<li class="disabled">Disabled List Item</li>

此外，如果您使用的是BootStrap，它们已经有一个名为disabled的类用于此目的。 查看此示例。

Also, if you are using BootStrap, they already have a class called disabled for this purpose. See this example.

这篇关于如何禁用UL内的特定LI元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！