时间戳

首页 > 解决方案 > 从 jQuery 触发 MaterializeCSS 组件事件

jquery - 从 jQuery 触发 MaterializeCSS 组件事件

问题描述

具体来说，我有一个Dropdown。我一直在尝试从这里开始的新事物。相同的链接显示了一些方法，例如“onOpenStart”、“onOpenClose”等等，它们基本上是下拉事件。

教程很模糊。没有演示如何使用这些事件。我尝试了 jQuery 中的每种语法来利用这些事件，但它们都不起作用，Chrome Dev Console向我显示错误，即使用的方法在 jQuery 上不存在。我只是希望有人将我指向一个文档或向我展示如何在 jQuery 中使用这些事件。

我的代码不起作用：

JS（jQuery）：

$(document).ready(function(){
    console.log("Ready");
    $('.sidenav').sidenav();
    $("#one").click(function(){
        $('.sidenav').sidenav('open');
    });
    $(".dropdown-trigger").dropdown();
    $("#dropdown1").dropdown('onOpenStart');
});

HTML：

<!-- Dropdown Structure -->
<ul id='dropdown1' class='dropdown-content'>
    <li><a href="#!">one</a></li>
    <li><a href="#!">two</a></li>
    <li class="divider" tabindex="-1"></li>
    <li><a href="#!">three</a></li>
    <li><a href="#!"><i class="material-icons">view_module</i>four</a></li>
    <li><a href="#!"><i class="material-icons">cloud</i>five</a></li>
</ul> 

<!-- Trigger Button -->
<a data-target="dropdown1" class="dropdown-trigger" href="mobile.html"><i class="material-icons">more_vert</i></a>

标签： jqueryhtmlmaterialize

解决方案

onOpenStart 是一个选项，你可以这样使用它：

$('#dropdown1').dropdown({
 hover: true,
 onOpenClose: function () {

 },
 onOpenStart: function () {
   //code
 }
});

简单的json格式:)

推荐阅读