切换Material Design Lite复选框

Agu*_*bos 15 javascript material-design-lite

我正在使用材料设计精简版复选框,我正在尝试使用JavaScript检查或取消选中该元素.我试过这个:

document.getElementById("checkbox-1").checked = true;
Run Code Online (Sandbox Code Playgroud)

那不行.我尝试了与jQuery相同的方法:

$("#checkbox-1").prop('checked',true); 
Run Code Online (Sandbox Code Playgroud)

那也行不通.任何帮助,将不胜感激.

Gar*_*bee 13

目前,1.0.0中的此组件存在一个错误,它不会作为窗口小部件公开.这已得到修复.目前在主数据库和几天内的1.0.1补丁程序中,它将以稳定版本的形式提供给每个人.

如果您有修补版本,这是处理它的正确方法:

要检查元素: document.querySelector('.mdl-js-checkbox').MaterialCheckbox.check()

并取消选中: document.querySelector('.mdl-js-checkbox').MaterialCheckbox.uncheck()

通过查看源代码并查看不以下划线结尾的属性,可以发现完整的API .如果它们以下划线结尾,则仅供内部使用,不支持外部使用.

我们正在努力记录JS API,但这需要更多的时间来完成并推出到网站.


Ron*_*ton 8

对于我们这些(每个人)在<input type="checkbox">元素和父对象上具有id或甚至类的人<label>,诀窍是在父对象上运行MDL方法.否则你会收到.MaterialCheckbox is undefined错误.

.parentElement.MaterialCheckbox.check();
.parentElement.MaterialCheckbox.uncheck();
Run Code Online (Sandbox Code Playgroud)

所以,例如:

var myCheckbox = document.getElementById('my-checkbox');
myCheckbox.parentElement.MaterialCheckbox.check();
Run Code Online (Sandbox Code Playgroud)