解决Layui的switch样式显示问题
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加载后样式总是显示勾选状态
<div class="layui-form-item" >
<label class="layui-form-label">启用</label>
<div class="layui-input-block" id="test">
<input type="checkbox" name="switch" lay-skin="switch" lay-text="启用|关闭" id="Isuse" value="否" checked>
</div>
</div>
这里我在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[].setAttribute("class", "layui-unselect layui-form-switch");
var d = document.getElementsByTagName('em')[];
d.firstChild.nodeValue = '关闭';
}

默认为启用状态,如下:

令附上判断此switch选择状态代码:
var isChecked = $("#Isuse").attr("checked") == "checked";
alert(isChecked.toString());
trur为选中(启用),false为未选中(关闭)
解决Layui的switch样式显示问题的更多相关文章
- nginx js、css、图片 及 一些静态文件中出现 http://upstreamname:port 导致部分网页样式显示不正常
nginx js.css.图片 及 一些静态文件中出现 http://upstreamname:port 导致部分网页样式显示不正常 http://upstreamname:port/....../. ...
- js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标
原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...
- bootstrap异步加载树后样式显示问题
整个过程: 1.先加载整个页面 2.通过jquery异步请求后台返回数据 3.循环遍历数据,拼接需要的内容 4.把拼接好的数据加载到页面中. 问题: 把拼接好的内容加载到页面后,样式显示不正确.而如果 ...
- 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新
在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...
- 解决 PHPExcel 长数字串显示为科学计数
解决 PHPExcel 长数字串显示为科学计数 在excel中如果在一个默认的格中输入或复制超长数字字符串,它会显示为科学计算法,例如身份证号码,解决方法是把表格设置文本格式或在输入前加一个单引号. ...
- 解决dede搜索页面只能显示10条信息解决方案
解决dede搜索页面只能显示10条信息解决方案,感觉显示的信息太少,这时就要想办法去解决一下.看看有什么好办法来解决一下这个问题. dede搜索页模板中,默认只能显示10条记录. 打开dede搜索页模 ...
- 解决每次打开office 2010显示正在配置的问题
解决每次打开office 2010显示正在配置的问题 OFFICE 2010 MSDN版出来后,下载安装 ,启动后发现每次打开都会出现“正在配置”的进度,删除重装亦不成功,对SETUP.EXE改名也不 ...
- 编码问题导致样式显示在IE中不正常
今天在做项目的时候,遇到样式显示不正常的问题,结果是因为用系统自带的notepad编辑器编辑文件时,编码格式被更改了.我们需要在Notepad++中,将编码格式改成Encode inUTF8 with ...
- 解决django关于图片无法显示的问题
http://python.usyiyi.cn/django/index.html http://m.blog.csdn.net/blog/qingyuanluofeng/44877399 http: ...
随机推荐
- Elasticsearch之match_phrase小坑记录
1.问题抛出 某个词组在Elasitcsearch中的某个document中存在,就一定通过某种匹配方式把它搜出来. 举例: title=公路局正在治理解放大道路面积水问题. 输入关键词:道路,能否搜 ...
- 2. DVWA亲测文件包含漏洞
Low级: 我们分别点击这几个file.php文件 仅仅是配置参数的变化: http://127.0.0.1/DVWA/vulnerabilities/fi/?page=file3.php 如 ...
- js基础(补10.10)
1.内嵌式: <html> <head> <title></title> </head> <body> <a href=& ...
- C/C++ Sleep(0)
Sleep(0) 的意义是放弃当前线程执行的时间片,把自身放到等待队列之中.这时其它的线程就会得到时间片进行程序的程序.Sleep(0)能够降低当前线程的执行速 度,比如:现在系统中有100个线程(先 ...
- HDU - 1176 免费馅饼 DP多种状态转移
免费馅饼 都说天上不会掉馅饼,但有一天gameboy正走在回家的小径上,忽然天上掉下大把大把的馅饼.说来gameboy的人品实在是太好了,这馅饼别处都不掉,就掉落在他身旁的10米范围内.馅饼如果掉在了 ...
- Halcon - 获取图像数据(灰度值)
在 Halcon 中,或许大部分人都知道如何通过 get_grayval 获取图像的灰度值,这条算子在获取单个像素时是比较好用的.但是当你想获取一幅大尺寸图像的一行甚至所有的灰度数据时,它就会变得很吃 ...
- linux安装AWStats业务数据分析工具
Awstats是一个非常简洁而且强大的统计工具.它可以统计您站点的如下信息:一:访问量,访问次数,页面浏览量,点击数,数据流量等精确到每月.每日.每小时的数据二:访问者国家.访问者IP.操作系统.浏览 ...
- CSS 绝对定位与相对定位的区别
设置为绝对定位的元素框从文档流完全删除, 并相对于其包含块定位,包含块可能是文档中的另一个元素或者是初始包含块. 元素原先在正常文档流中所占的空间会关闭,就好像该元素原来不存在一样. 元素定位后生成一 ...
- PV、UV、VV、IP是什么意思?
PV.UV.VV.IP作为网站分析中最常见的基础指标,能够从宏观概括性地衡量网站的整体运营状况,也是检测网站运营是否正常的最直观的指标. 1.VV(来访次数/访问次数):VisitView 记录所有访 ...
- webpack 打包和手动创建一个vue的项目
首先我们为啥要用webpack,为啥不用其他的打包的工具. 先听我捋捋, Webpack有人也称之为 模块打包机 ,由此也可以看出Webpack更侧重于模块打包,当然我们可以把开发中的所有资源(图片. ...