layui是我最近才接触的..也是新项目中用到的后台前端框架..与easyui有些类似..在这段时间的使用中,经常会碰到大大小小的问题..

1.选显卡切换又是加载数据表格。分页条不显示

2.layui.open弹出框中的无法触发用js.或者jquery写得触发事件..

等问题..但是这两个问题是我遇到过最坑的..

至于解决办法

1.针对分页栏无法显示..只能通过切换表格的时候重新加载数据表格

2.弹出框中的事件..只能使用layui的事件方式触发..例如我做了个复选款权限树..

但是却无法触发复选款改变事件..或者点击事件..通过不断的尝试..最后用了layui标准的复选款监听..才能触发..这浪费了我不少时间..

$('#add-btn').click(function(){

var index=layer.open({

type: 1

,area: ['550px','400px']

,title: ['添加门店', 'font-size:16px;height:40px;line-height:40px;background:#fff;border-top:3px solid #3a90b8;border-bottom:1px solid #e0e0e0']

,content: str

,btn: ['确认', '取消']

,shade: 0.1 //不显示遮罩

,yes: function(index, layero){

var str="";

$("#tip-organ").html();

$("#hidInfo").html();

var organs=$("input[name='fen1']");

var inpstr="";

for(var i=0;i<organs.length;i++){

var organ="";

if(organs[i].checked == true){

var title=organs[i].title;

organ=organs[i].value;

var id='id'+organ;

console.log(id);

str+=title;

str+=':';

inpstr+='<input type="hidden" name="organId" id="shopId" value="'+organ+'">';

var online=$("#"+id+" input[name='type1']").is(':checked');

console.log(online);

var offLine=$("#"+id+" input[name='type2']").is(':checked');

console.log(offLine);

if(online==true && offLine==true){

inpstr+='<input type="hidden" name="kind" id="applykind" value="3">'

str+=$("#"+id+" .shop-two-unit input:checkbox[name='type1']:checked").attr("title");

str+=",";

str+=$("#"+id+" input:checkbox[name='type2']:checked").attr("title");

}else if(offLine==true && online==false){

var title=$("#"+id+" input:checkbox[name='type2']:checked").attr("title");;

str+=title;

str+=",";

inpstr+='<input type="hidden" name="kind" id="applykind" value="2">'

}else if(online==true && offLine==false){

var title=$("#"+id+" input:checkbox[name='type1']:checked").attr("title");;

str+=title;

str+=",";

inpstr+='<input type="hidden" name="kind" id="applykind" value="1">'

}else{

layer.msg('请选择门店活动适用范围!');

return false;

}

}

}

$("#tip-organ").html(str);

$("#hidInfo").html(inpstr);

layer.closeAll();

}

,cancel: function(index, layero){

}, success: function(layero, index){

shopstr=loadShopDom();

$(".shop-r").html(shopstr);

var form = layui.form;

form.render('checkbox');

$("document").on('click','#father',function(){

alert("2");

if ($(this).prop("checked") == true) {

$(this).parents("li").eq(0).find("input:checkbox").prop("checked", true);

} else {

$(this).parents("li").eq(0).find("input:checkbox").prop("checked",false);

}

var form = layui.form;

form.render('checkbox');

});

$('#father').click(function(){

alert("2");

if ($(this).prop("checked") == true) {

$(this).parents("li").eq(0).find("input:checkbox").prop("checked", true);

} else {

$(this).parents("li").eq(0).find("input:checkbox").prop("checked",false);

}

form.render('checkbox');

});

form.on('checkbox(owner_one)', function(data){

if ($(this).prop("checked") ==true) {

$(this).parents("li").parents("li").eq(0).find("input:checkbox.father").prop("checked", true);

} else {

if ($(this).parents("li").parents("li").eq(0).find("input:checkbox:not(.father):checked").length == 0) {

$(this).parents("li").parents("li").eq(0).find("input:checkbox.father").prop("checked",false);

}

}

form.render('checkbox');

});

form.on('checkbox(owner_all)', function(data){

var a = data.elem.checked;

if(a == true){

$(this).parents("li").eq(0).find("input:checkbox").prop("checked", true);

form.render('checkbox');

}else{

$(this).parents("li").eq(0).find("input:checkbox").prop("checked",false);

form.render('checkbox');

}

});

}

});

});

});

LayUI最近遇到的问题以及处理的更多相关文章

  1. layui常用方法

    很好用的一个ui组件,弹出,分页等 http://layer.layui.com/ 1 带叉叉的弹窗 layer.open({ type: , title: false, //不显示标题 conten ...

  2. 开源网站.NETMVC+ Layui+SqlSugar+RestSharp

    SugarSite一个前端支持移动端的企业网站,目前只支持了简单功能,后续还会加上论坛等. 源码GIT地址: https://github.com/sunkaixuan/SugarSite 技术介绍 ...

  3. 分页组件 - layui.laypage

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 日期时间组件 - layui.laydate

    全部参数 一.核心方法:laydate(options); options是一个对象,它包含了以下key: '默认值' { elem: '#id', //需显示日期的元素选择器 event: 'cli ...

  5. 关于layui

    之前用layer用了很长时间,感觉很好用,最近看到了layui的发布很想尝试尝试. 加入了挺多的功能,比如编辑器,上传,form表单等等.

  6. 日期控件,layui

    <link rel="stylesheet" href="<%=path%>/layui/css/layui.css" type=" ...

  7. 使用的组件:Layui

    Layui 经典模块化前端框架 由职业前端倾情打造,面向所有层次的前后端程序猿,中国最容易使用的前端UI解决方案 Layui 出蛋于2016年金秋,是一款带着浓烈情怀的国产前端UI框架,她追求极简,又 ...

  8. 【开源项目SugarSite】ASP.NET MVC+ Layui+ SqlSugar+RestSharp项目讲解

    SugarSite一个前端支持移动端的企业网站,目前只支持了简单功能,后续还会加上论坛等. 源码GIT地址: https://github.com/sunkaixuan/SugarSite 技术介绍 ...

  9. 前端框架layui

    可以了解下jQuery组件layer layui开始使用Layui兼容除IE6/7以外的全部浏览器,并且绝大多数结构支持响应式 弹出层如果你使用的是Layui,那么你直接在官网下载layui框架即可, ...

  10. Layui - 示例

    示例地址 http://www.layui.com/demo/ 下载地址 http://www.layui.com/ 示例代码 <!doctype html> <html> & ...

随机推荐

  1. 某个应用的CPU使用率居然达到100%,我该怎么做?(三)

    某个应用的CPU使用率居然达到100%,我该怎么做?(三) 1. 引 你们好,可爱的小伙伴们^_^! 咱们最常用什么指标来描述系统的CPU性能呢?我想你的答案,可能不是平均负载,也不是CPU上下文切换 ...

  2. 转载:Angular的filter总结

    过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果.主要用在数据的格式化上,例如获取一个数组 中的子集,对数组中的元素进行排序等.ng内置了一些过滤器,它 ...

  3. Codeforces 353E 贪心

    题意:给你一张有向图,第i条边连接i号点和(i + 1) % n号点,问最多可以选择多少个点,使得这些点互相不可达. 思路:容易发现,如果某个边的集合点的数目大于等于2,那么就可以选出一个点,当然也可 ...

  4. 【串线篇】mybatis-config.xml配置事项

    一.术语 properties 属性 settings 设置 typeAliases 类型命名 typeHandlers 类型处理器 objectFactory 对象工厂, plugins 插件, e ...

  5. 最大流的EK算法模板

    模板题:洛谷p3376 题目大意: 给出一个网络图,以及其源点和汇点,求出其网络最大流. 基本思路: 套模板 EK的时间复杂度O(V*E^2) EK算法思路: 1.通过BFS拓展合法节点(每个节点在本 ...

  6. java SSLContext

    1. 什么是SSLSocket JDK文档指出,SSLSocket扩展Socket并提供使用SSL或TLS协议的安全套接字. 这种套接字是正常的流套接字,但是它们在基础网络传输协议(如TCP)上添加了 ...

  7. HDU 6610 Game — 2019第三场杭电多校 1008题

    目录 题意 思路 AC_Code @(hdu 6610) 题意 大概说一下我理解的题意... 链接:here 你有\(n\)堆石子,每堆石子有\(a_i\)个石子.游戏规则:\(Alice\)先选择一 ...

  8. python selenium 自动化流程的一些总结与思考

    首先要考虑的项目为什么要做自动化测试?(主要从自动化测试的优点着手) 其次是什么项目才适合做自动化测试? 自动化测试覆盖率要达到什么样的程度?因为都知道不可能达到100%的,不然脚本太臃肿,反而会失去 ...

  9. generate ascii table

    $ cat ascii.sh dec_count=0 while [ $dec_count -lt 256 ] do echo -e "\x$(echo "ibase=10;oba ...

  10. Perceptron Algorithm 感知器算法及其实现

    Rosenblatt于1958年发布的感知器算法,算是机器学习鼻祖级别的算法.其算法着眼于最简单的情况,即使用单个神经元.单层网络进行监督学习(目标结果已知),并且输入数据线性可分.我们可以用该算法来 ...