mui js控制開(kāi)關(guān)狀態(tài)、修改switch開(kāi)關(guān)的值方法

發(fā)布時(shí)間：2020-09-05 11:01:33 來(lái)源：腳本之家閱讀：445 作者：P_Alex 欄目：web開(kāi)發(fā)

修改開(kāi)關(guān)的值

 .mui-switch:before{
  font-size: 13px;
  position: absolute;
  top: 3px;
  right: 11px;
  content: attr(data-off);
  text-transform: uppercase;
  color: #999;
  }
  .mui-switch.mui-active:before{
  right: auto;
  left: 15px;
  content: attr(data-on);
  color: #fff;
  }



<div class="mui-content">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<span>報(bào)警消息設(shè)置</span>
<div class="mui-switch mui-active" id="mySwitch" data-off="關(guān)" data-on = "開(kāi)">
<div class="mui-switch-handle"></div>
</div>
</li> 
</ul> 
</div>

控制開(kāi)關(guān)狀態(tài)：

document.getElementById("mySwitch").addEventListener("toggle",function(event){ 
if(event.detail.isActive){
  var btnArray = ['取消', '確認(rèn)'];
mui.confirm('關(guān)閉報(bào)警推送消息后,系統(tǒng)將不再推送報(bào)警消息?', '警告!', btnArray, function(e) {
if(e.index==1){
console.log("你關(guān)閉了報(bào)警推送");
}else{
mui("#mySwitch").switch().toggle(); 
}
},'div') 
}else{
  
}
})

以上這篇mui js控制開(kāi)關(guān)狀態(tài)、修改switch開(kāi)關(guān)的值方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持億速云。

向AI問(wèn)一下細(xì)節(jié)

mui js控制開(kāi)關(guān)狀態(tài)、修改switch開(kāi)關(guān)的值方法

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽

mui js控制開(kāi)關(guān)狀態(tài)、修改switch開(kāi)關(guān)的值方法