UIkit的Toggle切换器为什么点击没反应？

UI美含提问于 2026-03-26 19:59:15 阅读 29

组件

我在用UIkit做页面，想用Toggle组件控制一个div的显示隐藏，但点击按钮完全没效果。HTML结构应该没问题，也引入了UIkit的JS文件，不知道是不是写法不对？

试过官方文档的例子，但我的代码就是不生效，控制台也没报错，很困惑。

UIkit.toggle('#my-toggle', {
    target: '#target-div',
    mode: 'click'
});

UIkit UI框架前端框架

我来解答赞 4 收藏

反馈

1 条解答

广云 Lv1

我看你用的是UIkit的Toggle组件，写法上有个小问题。UIkit 3.x版本后，初始化Toggle组件的方式变了。

试试改成这样：

UIkit.util.ready(function() {

    var toggle = UIkit.toggle(document.querySelector('#my-toggle'), {

        target: '#target-div'

    });

});

记得把你的HTML结构也检查下，按钮需要有 uk-toggle属性，比如 <button id="my-toggle" uk-toggle>切换</button>

另外确认下UIkit的CSS和JS都加载成功了，有时候资源没加载也会导致不生效。希望能帮到你啊，这个问题之前我也遇到过，确实挺烦人的。

2026-03-26 20:04