博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
解决Layui的switch样式显示问题
阅读量:6697 次
发布时间:2019-06-25

本文共 1353 字,大约阅读时间需要 4 分钟。

Layui官方文档是这么说的:

<input type="checkbox" name="xxx" lay-skin="switch">

<input type="checkbox" name="yyy" lay-skin="switch" lay-text="ON|OFF" checked>

<input type="checkbox" name="zzz" lay-skin="switch" lay-text="开启|关闭">

<input type="checkbox" name="aaa" lay-skin="switch" disabled>

----------------------------------------------------------------------------------------------------

属性checked可设定默认开 

属性disabled开启禁用 

属性lay-text可自定义开关两种状态的文本 

设置value="1"可自定义值,否则选中时返回的就是默认的on

可是从一个页面A调到另一个页面B怎么动态设置页面B的这个check状态呢?默认将checked属性加上后,页面B加载后样式总是显示勾选状态

 

这里我在JS里面判断,如果加载页面B不需要将样式显示为选中状态,那么我强制将layui-form动态生成的html的class更改成unchecked的样式,代码如下:

if (Isuse == '是') {            $("#Isuse").attr("checked", "checked");            $("#Isuse").attr("value",'是');        }        else {            $("#Isuse").removeAttr("checked");            var x = document.getElementsByClassName("layui-unselect layui-form-switch layui-form-onswitch");            x[0].setAttribute("class", "layui-unselect layui-form-switch");            var d = document.getElementsByTagName('em')[0];            d.firstChild.nodeValue = '关闭';        }

默认为启用状态,如下:

令附上判断此switch选择状态代码:

var isChecked = $("#Isuse").attr("checked") == "checked";  alert(isChecked.toString());

trur为选中(启用),false为未选中(关闭)

 

转载于:https://www.cnblogs.com/evanmemo/p/9166870.html

你可能感兴趣的文章
SEO艺术
查看>>
Python标准库
查看>>
SQL基础教程
查看>>
POJ 3683 Priest John's Busiest Day(2-ST)
查看>>
Why std::binary_search of std::list works, sorta ...(转载)
查看>>
一起谈.NET技术,在MVC2.0使用Lodop为WEB打印提出完美解决方案
查看>>
瑞星2009:3大拦截2大防御功能主动遏制木马病毒
查看>>
Android RIL源码研究笔记 の ril (一)
查看>>
手动添加mysql服务
查看>>
javascirpt历史澄清误解基本概念特点编程语言web2.0网页javascript - javascirpt知识大全...
查看>>
Java多线程同步Synchronized使用分析
查看>>
[ mongoDB ] - mongoDB的基本操作
查看>>
gson-2.2.api简单
查看>>
大跃进和循序渐进
查看>>
纯后台生成highcharts图片有哪些方法?
查看>>
Oracle手边常用70则脚本知识汇总
查看>>
Creating Apps With Material Design —— Creating Lists and Cards
查看>>
GIS基础软件及操作(二)
查看>>
Underscore.js (1.7.0)-函数预览
查看>>
Why does pthread_cond_signal not work?【转】
查看>>