mui js控制開關(guān)狀態(tài)、修改switch開關(guān)的值方法
更新時(shí)間：2019年09月03日 16:23:13 作者：P_Alex
今天小編就為大家分享一篇mui js控制開關(guān)狀態(tài)、修改switch開關(guān)的值方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
修改開關(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 = "開">
<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 = ['取消', '確認(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控制開關(guān)狀態(tài)、修改switch開關(guān)的值方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
webpack cjs運(yùn)行時(shí)分析示例詳解
這篇文章主要介紹了webpack cjs運(yùn)行時(shí)分析，本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-12-12
Javascript中構(gòu)造函數(shù)要注意的一些坑
JavaScript語言是一門面向?qū)ο蟮恼Z言，但JS中并沒有類的概念的。于是JavaScript采用構(gòu)造函數(shù)的方式來模擬類的效果，即我們通過函數(shù)來創(chuàng)建對(duì)象。這也證明了函數(shù)在JavaScript中具有非常重要的地位。本文主要介紹了Javascript中構(gòu)造函數(shù)的一些坑,需要的朋友可以參考。2017-01-01
這篇文章主要介紹了微信小程序如何訪問公眾號(hào)文章，隨著小程序不斷的發(fā)展，現(xiàn)在個(gè)人的小程序也開放了很多功能了，個(gè)人小程序直接打開公眾號(hào)鏈接。在群里看到的一款小程序，點(diǎn)擊可以直接閱讀文章了,需要的朋友可以參考下2019-07-07
這篇文章主要介紹了使用 js+正則表達(dá)式為關(guān)鍵詞添加鏈接,十分的簡(jiǎn)單，需要的朋友可以參考下2014-11-11
JavaScript實(shí)現(xiàn)定時(shí)器循環(huán)展示數(shù)組
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)定時(shí)器循環(huán)展示數(shù)組，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-09-09
最近有項(xiàng)目要實(shí)現(xiàn)N級(jí)菜單，首先從布局入手，即判斷是否有下級(jí)菜單，具體實(shí)現(xiàn)代碼，大家可以參考下本文2017-05-05
這篇文章主要介紹了javascript限制用戶只能輸漢字中文的方法,實(shí)例列舉了利用Unicode判斷與正則判斷兩種方法,具有一定的實(shí)用價(jià)值,需要的朋友可以參考下2014-11-11
Js使用WScript.Shell對(duì)象執(zhí)行.bat文件和cmd命令
這篇文章主要介紹了Js使用WScript.Shell對(duì)象執(zhí)行.bat文件和cmd命令,需要的朋友可以參考下2014-12-12
淺析webpack 如何優(yōu)雅的使用tree-shaking（搖樹優(yōu)化）
這篇文章主要介紹了webpack 如何使用tree-shaking（搖樹優(yōu)化）,本文介紹了什么是tree-shaking,commonJS 模塊,es6 模塊,怎么使用tree-shaking等,具體操作步驟大家可查看下文的詳細(xì)講解，感興趣的小伙伴們可以參考一下。2017-08-08
JavaScript實(shí)現(xiàn)點(diǎn)擊按鈕復(fù)制指定區(qū)域文本(推薦)
這篇文章主要介紹了JavaScript實(shí)現(xiàn)點(diǎn)擊按鈕復(fù)制指定區(qū)域文本(推薦)的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-11-11