MUI H5+常见控件的使用之开关

来源:互联网 发布:爱奇艺网络剧哪些好看 编辑:程序博客网 时间:2024/03/28 16:44

开关 比如已婚/未婚


HTML

<label style="width:40%;">婚姻状况</label><div id="Marriage" class="mui-switch mui-switch-blue " data-on="已婚" data-off="未婚"><div class="mui-switch-handle "></div></div>
var marriage = document.getElementById('Marriage'); //婚姻状况

Get

var marriageValue = 0;;marriage.addEventListener('toggle', function(event) {//event.detail.isActive 可直接获取当前状态if(event.detail.isActive) {marriageValue = 1;} else {marriageValue = 0;}});

Set

if(result.userInfo.Marriage == 1) {marriage.classList.add('mui-active');//结婚}