Semantic UI 中Checkbox的选中等事件

没写过博客,还望大家不要见笑。

在做网页的过程中,使用了Semantic UI,遇到一些问题,诸如图标显示不全,下拉框无效或者Checkbox不能选中......
在此记录一下:Checkbox需加上"$('.ui.checkbox').checkbox();"
而且用onclick() 起不到效果,这里我用了onchange()
下面是我做过的一个小例子,全选与取消全选(一个Checkbox),发现在网上找的方法对于这个UI有些总是无效的,可能是jquery版本亦或是别的原因,最终这段代码实现了也就想保留下来。

 <div class="ui checkbox">
                            <input type="checkbox" id="seleAll" class="seleAccountCheck" οnchange="seleAll(this)">
                        </div>
                        <span>全选</span>

<pre name="code" class="html"><div class="ui checkbox">
                                    <input type="checkbox" name="seleChildCheck" id="seleChildCheck" class="seleAccountCheck" />
                                </div>
<div class="ui checkbox">
                                    <input type="checkbox" name="seleChildCheck" id="seleChildCheck" class="seleAccountCheck" />
                                </div>

下面是js

function seleAll(obj) {
        $('input[name="seleChildCheck"]').attr("checked", obj.checked);
        var $seleattr = $("input[name='seleChildCheck']");
        $seleattr.click(function () {
            $("#seleAll").attr("checked", $seleattr.length == $("input[name='seleChildCheck']:checked").length ? true : false);
        });
    }



运行结果如图





                
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值