1 問題描述

我的菜單是<ul> ，每個菜單項都是<li> ，目前都可以點擊，代碼如下：

<ul>
     <li><span class="tool-item">Tensorflow</span></li>
     <li><span class="tool-item">Kaldi</span></li>
     <li><span class="tool-item">Theano</span></li>
     <li><span class="tool-item">Keras</span></li>
     <li><span class="tool-item">Mxnet</span></li>
     <li><span class="tool-item">Caffe</span></li>
</ul>

根據某些需求和條件，想禁用特定的<li> 元素，但仍想顯示該項目，要求只是無法點擊。嘗試在<li> 和列表樣式中使用disabled屬性，發現都沒有用。

2 解決辦法

如果仍想顯示該項目，只是無法點擊，可以使用CSS禁用該項目。

//CSS
.disabled {
    pointer-events:none; //使其不可點擊
    opacity:0.6;         //使其樣式變為不可用
}

<ul>
     <li class="disabled"><span class="tool-item">Tensorflow</span></li>
     <li class="disabled"><span class="tool-item">Kaldi</span></li>
     <li class="disabled"><span class="tool-item">Theano</span></li>
     <li class="disabled"><span class="tool-item">Keras</span></li>
     <li class="disabled"><span class="tool-item">Mxnet</span></li>
     <li class="disabled"><span class="tool-item">Caffe</span></li>
</ul>