语义 UI jquery 根本不起作用

Question

以下是我的代码中与问题相关的部分：

<head>
    <link rel="stylesheet" type="text/css" href="/static/semantic/dist/semantic.rtl.min.css" />
    <?php Yii::app()->clientScript->registerCoreScript('jquery'); ?>
    <script src="/static/semantic/dist/semantic.min.js"></script>
    <script src="/static/semantic/dist/components/dropdown.min.js"></script>
    <script>
        $('.ui.dropdown')
            .dropdown()
        ;
    </script>
</head>

<body>

<div class="ui dropdown">
    <input type="hidden" name="gender">
    <i class="dropdown icon"></i>
    <div class="default text">Gender</div>
    <div class="menu">
        <div class="item" data-value="male">Male</div>
        <div class="item" data-value="female">Female</div>
    </div>
</div>

</body>

下拉菜单似乎无法正常工作。我也尝试过其他东西（搜索、手风琴），但效果不佳。

在不同的浏览器、不同的平台上检查过，没有。

还检查过加载文件可能存在问题，但根据 Chrome 一切都加载正常并且没有错误。

Answer 1

调用dropdown插件时页面上没有.ui.dropdown元素。当 DOM 就绪时，您需要对其进行初始化：

$(function() {
    $('.ui.dropdown').dropdown();
});

或者您也可以在关闭 </body> 标签之前放置您的原始脚本块，这样也可以。

语义 UI jquery 根本不起作用

SemanticUI jquery is not working at all

javascript

jquery

semantic-ui