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

更新時間：2019年09月03日 16:23:13 作者：P_Alex

今天小編就為大家分享一篇mui js控制開關(guān)狀態(tài)、修改switch開關(guān)的值方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

修改開關(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>報警消息設置</span>
<div class="mui-switch mui-active" id="mySwitch" data-off="關(guān)" data-on = "開">
<div class="mui-switch-handle"></div>
</div>
</li> 
</ul> 
</div>

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

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

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

您可能感興趣的文章:

相關(guān)文章

webpack cjs運行時分析示例詳解
這篇文章主要介紹了webpack cjs運行時分析，本文結(jié)合示例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
2022-12-12
Javascript中構(gòu)造函數(shù)要注意的一些坑
JavaScript語言是一門面向?qū)ο蟮恼Z言，但JS中并沒有類的概念的。于是JavaScript采用構(gòu)造函數(shù)的方式來模擬類的效果，即我們通過函數(shù)來創(chuàng)建對象。這也證明了函數(shù)在JavaScript中具有非常重要的地位。本文主要介紹了Javascript中構(gòu)造函數(shù)的一些坑,需要的朋友可以參考。
2017-01-01
微信小程序如何訪問公眾號文章
這篇文章主要介紹了微信小程序如何訪問公眾號文章，隨著小程序不斷的發(fā)展，現(xiàn)在個人的小程序也開放了很多功能了，個人小程序直接打開公眾號鏈接。在群里看到的一款小程序，點擊可以直接閱讀文章了,需要的朋友可以參考下
2019-07-07
使用 js+正則表達式為關(guān)鍵詞添加鏈接
這篇文章主要介紹了使用 js+正則表達式為關(guān)鍵詞添加鏈接,十分的簡單，需要的朋友可以參考下
2014-11-11
JavaScript實現(xiàn)定時器循環(huán)展示數(shù)組
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)定時器循環(huán)展示數(shù)組，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-09-09
原生JS實現(xiàn)N級菜單的代碼
最近有項目要實現(xiàn)N級菜單，首先從布局入手，即判斷是否有下級菜單，具體實現(xiàn)代碼，大家可以參考下本文
2017-05-05
javascript限制用戶只能輸漢字中文的方法
這篇文章主要介紹了javascript限制用戶只能輸漢字中文的方法,實例列舉了利用Unicode判斷與正則判斷兩種方法,具有一定的實用價值,需要的朋友可以參考下
2014-11-11
Js使用WScript.Shell對象執(zhí)行.bat文件和cmd命令
這篇文章主要介紹了Js使用WScript.Shell對象執(zhí)行.bat文件和cmd命令,需要的朋友可以參考下
2014-12-12
淺析webpack 如何優(yōu)雅的使用tree-shaking（搖樹優(yōu)化）
這篇文章主要介紹了webpack 如何使用tree-shaking（搖樹優(yōu)化）,本文介紹了什么是tree-shaking,commonJS 模塊,es6 模塊,怎么使用tree-shaking等,具體操作步驟大家可查看下文的詳細講解，感興趣的小伙伴們可以參考一下。
2017-08-08
JavaScript實現(xiàn)點擊按鈕復制指定區(qū)域文本(推薦)
這篇文章主要介紹了JavaScript實現(xiàn)點擊按鈕復制指定區(qū)域文本(推薦)的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
2016-11-11