Zurb foundation ZURB基金会禁用选项卡 我使用ZURB基金会，有以下HTML： <div class="section-container auto" data-section> <section> <p class="title" data-section-title><a href="#panel1">Tab 1</a></p> <div class="content" data-section-content> <p>Content of section 1.</p> </div> </section> <section> <p class="title" data-section-title><a href="#panel2">Tab 2</a></p> <div class="content" data-section-content> <p>Content of section 2.</p> </div> </section> </div>

第1节的内容

第2节的内容

---

是否可以禁用第二个选项卡？选项卡按钮应该是可见的，但不能单击。

您可以添加一些CSS来禁用它

.disabled {
   pointer-events: none;
   cursor: default;
}

编辑

---

关于Dolondro的注释和指针事件在IE中不起作用，请参见

稍微脏一点的hack，但它在任何地方都会起作用（别忘了将类“disabled”添加到

标记中）

---

您可以设置自定义链接类，仅通过<代码>数据链接类考虑启用的选项卡，然后使用指定的类仅启用的选项卡。

<ul class="tabs" data-tabs data-link-class="enabled" id="disabled-tabs">
    <li class="enabled"><a>Tab 1</a></li>
    <li><a>Tab 2</a></li>
</ul>

---

当您使用基础4时，IE8无论如何都不在窗口中，但是指针事件的使用也不会在IE9或IE10中发挥作用。好的一点，关于IE中指针事件的信息，请参见，因为我不太关心IE，这对我很有用=）

<ul class="tabs" data-tabs data-link-class="enabled" id="disabled-tabs">
    <li class="enabled"><a>Tab 1</a></li>
    <li><a>Tab 2</a></li>
</ul>

.tabs li:not(.enabled) a {
  pointer-events: none;
}