<div class="mui-content">
        <button id="showBtn" class="mui-btn mui-btn-primary">显示功能框</button>
    </div>
    <script src="https://cdn.bootcdn.net/ajax/libs/mui/3.7.1/js/mui.min.js"></script>
    <script>
        mui.init();
<pre><code>    var showBtn = document.getElementById('showBtn');

    showBtn.addEventListener('tap', function() {
        var btnArray = [
            {title:'删除',style:{color:'#FF0000'}},
            {title:'清空',style:{color:'#007AFF'}}
        ];

        mui.actionSheet({
            buttons: btnArray,
            cancel: &quot;取消&quot;
        }, function(e) {
            if (e.index == 0) {
                // 点击了删除按钮
                console.log(&quot;点击了删除按钮&quot;);
            } else if (e.index == 1) {
                // 点击了清空按钮
                console.log(&quot;点击了清空按钮&quot;);
            } else {
                // 点击了取消按钮或者其他地方
                console.log(&quot;点击了取消按钮或者其他地方&quot;);
            }
        });
    });
&lt;/script&gt;
</code></pre>
</body>
</html>
<p>在示例代码中,我们首先引入了 mui.min.css 和 mui.min.js 文件。然后在页面中添加了一个按钮,点击按钮后会显示一个包含删除和清空按钮的功能框。当用户点击其中一个按钮时,会触发相应的回调函数。当用户点击取消按钮或者其他地方时,会关闭功能框。</p>
使用 mui.min.js 显示功能框,并添加删除和清空按钮

原文地址: https://www.cveoy.top/t/topic/jExq 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录