返回介绍

按钮 / Button

发布于 2020-05-15 10:53:26 字数 1294 浏览 909 评论 0 收藏 0

普通青年

<button id="btn" class="ui-button">aaa</button>
require(['jquery', 'ui/Button'], function ($, Button) {
    new Button({
        main: document.getElementById('button1')
    })
    .render();
});

参数配置

require(['jquery', 'ui/Button'], function ($, Button) {
    new Button({
        main: document.getElementById('button2'),
        width: '100px',
        height: '61.8px',
        text: 'hello world~'
    })
    .render();
});

事件绑定

require(['jquery', 'ui/Button'], function ($, Button) {

    var i = 0;

    new Button({
        main: document.getElementById('button3'),
        text: '赞'
    })
    .render()
    .on('click', function (e) {
        this.setText('+' + (++i));
    });

});

应用于<a>标签

require(['jquery', 'ui/Button'], function ($, Button) {

    new Button({
        main: document.getElementById('button4')
    })
    .render();

});

禁用状态

require(['jquery', 'ui/Button'], function ($, Button) {

    new Button({
        main: document.getElementById('button5'),
        disabled: true
    })
    .render()
    .on('click', function () {
        console.log('如果这里被调用就出错了哟~');
    });

});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文