Layui給switch添加響應事件的例子
更新時間:2019年09月03日 16:09:42 作者:阿圣_Code
今天小編就為大家分享一篇Layui給switch添加響應事件的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
今天做項目時,遇到layui中的switch,需要給這個開關(guān)添加事件,也就是當你點擊是會彈框提示
剛開始我用傳統(tǒng)的處理方法,直接給它添加個js事件,到最后會發(fā)現(xiàn),沒響應,于是我查文檔,逛論壇終于找到一個解決辦法,代碼如下
<input type="checkbox" name="zzz" lay-skin="switch" lay-filter="switchTest" lay-text="開啟|關(guān)閉" checked="checked">//開關(guān)
//js處理
layui.use(['form', 'jquery', 'layer'], function () {
var form = layui.form;
var jquery = layui.jquery;
var layer = layui.layer;
//監(jiān)聽開關(guān)事件
form.on('switch(switchTest)', function (data) {
var contexts;
var x = data.elem.checked;//判斷開關(guān)狀態(tài)
if (x==true) {
contexts = "你確定要啟動么";
} else {
contexts = "你確定要關(guān)閉么";
}
layer.open({
content: contexts
, btn: ['確定', '取消']
, yes: function (index, layero) {
data.elem.checked = x;
form.render();
layer.close(index);
//按鈕【按鈕一】的回調(diào)
}
, btn2: function (index, layero) {
//按鈕【按鈕二】的回調(diào)
data.elem.checked = !x;
form.render();
layer.close(index);
//return false 開啟該代碼可禁止點擊該按鈕關(guān)閉
}
, cancel: function () {
//右上角關(guān)閉回調(diào)
data.elem.checked = !x;
form.render();
//return false 開啟該代碼可禁止點擊該按鈕關(guān)閉
}
});
return false;
});
});
哈哈,總之,既然用人家layui框架,就要準守人家的規(guī)矩!任何事件都要監(jiān)聽的,單純的寫js事件是沒反應的,監(jiān)聽事件要寫在 layui.use({})中。
以上這篇Layui給switch添加響應事件的例子就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
js 復制功能 支持 for IE/FireFox/mozilla/ns
js 復制功能 支持 for IE/FireFox/mozilla/ns...2007-11-11
JS實現(xiàn)根據(jù)數(shù)組對象的某一屬性排序操作示例
這篇文章主要介紹了JS實現(xiàn)根據(jù)數(shù)組對象的某一屬性排序操作,涉及javascript針對json數(shù)組的遍歷、比較、排序等相關(guān)操作技巧,需要的朋友可以參考下2019-01-01

