菜单不适用于语义 UI，例如示例代码

Question

我是 web 开发的初学者，我现在正在为我的 font-end 使用语义-ui 框架development.I 已经在这个 [=24] 上尝试了第一个示例菜单的示例代码=].

http://semantic-ui.com/collections/menu.html

但是我的菜单不会在点击时改变活动状态 this.I 已经尝试了 $("..").menu() 方法并且它显示 $(..).menu 不是 function.I 想知道你是否可以帮助我 please.Shall 我必须编写自定义 Javascript 代码来更改单击或悬停时的活动状态。这是我的代码

<!DOCTYPE html>
<html lang="">
<head>


    <script src="jquery.js"></script>
<link rel="stylesheet" type="text/css" href="Semantic-UI-master/dist/semantic.min.css">


<script src="Semantic-UI-master/dist/semantic.min.js"></script>

<style>

    </style>
</head>
<div class="ui three item menu">
  <a class="item">Editorials</a>
  <a class="item">Reviews</a>
  <a class="item active">Upcoming Events</a>
</div>
</html>

Answer 1

使用这个：

$('.ui .item').on('click', function() {
   $('.ui .item').removeClass('active');
   $(this).addClass('active');
});

Answer 2

虽然没有直接回答最初的问题，但我认为值得指出的是任何下拉式菜单都将取决于下拉菜单 javascript。例如，以下菜单：

<div class="ui top attached menu">
  <div class="ui dropdown icon item">
    <i class="wrench icon"></i>
    <div class="menu">
      <div class="item">
        item text here...
      </div>
    </div>
  </div>
</div>

需要附上：

$('.ui.dropdown').dropdown();

Answer 3

您也可以只将 simple 放在菜单 class 中： <div class="ui simple three item menu">

菜单不适用于语义 UI，例如示例代码

Menu not working for semantic UI like Example Code

semantic-ui