semantic-ui 设置复选框的状态始终为打开，并且是disabled状态

　　设置disabled，可以在两个地方设置，一个是在外层的div上面设置，一个是在input checkbox里面设置。

　　设置checked，只能在input checkbox中设置。

 

默认未选中，且禁止修改

<div class="ui disabled checkbox">
    <input type="checkbox">
    <label>禁用</label>
</div>
<div class="ui disabled toggle checkbox">
    <input type="checkbox">
    <label>禁用</label>
</div>

　　

　　观察效果会发现，虽然这两个复选框不可以更改选中状态，但是，当鼠标移动到复选框上时，复选框仍然有反应（颜色会变深一点点）

　　单击复选框没有反应。

　　

默认选中，且禁止修改

<div class="ui disabled  checkbox">
    <input type="checkbox" checked>
    <label>禁用</label>
</div>
<div class="ui disabled toggle checkbox">
    <input type="checkbox" checked>
    <label>禁用</label>
</div>

　　

　　可以发现，此时复选框的状态为不可更改的，并且是选中的，单击复选框没有反应。

　　但是在我的环境中，这个代码的复选框却并不是这样的反应。首先也的确是像现在一样有一定透明度，但是却可以点击一下，就会将状态改为关闭，然后在点击时，才没有反应。可能是兼容性的原因。

　　所以我为了保险，改成这样：

<div class="ui disabled checkbox" onclick="return false">
    <input type="checkbox" checked disabled>
    <label>禁用</label>
</div>
<div class="ui disabled toggle checkbox" onclick="return false">
    <input type="checkbox" checked disabled>
    <label>禁用</label>
</div>

　　对于其他情况，也可以参考这种方法。　

　　上面的复选框的确是不能修改状态，而且状态的确是选中的状态。但是如果想要让选项没有透明度，即正常显示，可以组合一下上面的代码：

<div class="ui checkbox" onclick="return false">
    <input type="checkbox"  checked>
    <label>禁用</label>
</div>
<div class="ui toggle checkbox" onclick="return false">
    <input type="checkbox" checked>
    <label>禁用</label>
</div>

　　没错，只需要一条onclick='return false'即可。