为您找到搜索结果：166个
layui社区源码笔记之layui-input form
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><style>.fly-search{position:relative;margin-left:10px;display:inline-block;vertical-align:top;}.fly-searchinput{padding-right:30px;}.layui-input{display:block;width:100%;padding-left:10px;}.layui-input{height:38px;line-height:38px;border:1pxsolid#e6e6e6;background-color:#fff;border-radius:2px;box-sizing:border-box!important;---div设置的宽高将包含边框及padding}</style>//引用图标字体<linkr...
layui社区源码笔记之fly-tab
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><style>.fly-tabspana{height:36px;line-height:36px;padding:020px;border-right:1pxsolid#ddd;font-size:14px;background-color:#fff;}.fly-tabspan,.fly-tabspana{display:inline-block;vertical-align:top;}.fly-tabspan{border:1pxsolid#ddd;font-size:0;}a{text-decoration:none;color:#333;}</style></head><body><divclass="fly-tab"><span><ahref="jie/index.html"&g...
layui社区模板主页框架分析
html代码：<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><linkhref="reset.css"rel="stylesheet"type="text/css"></head><body><divclass="header">iamheader</div><divclass="main">iammain<divclass="wrap">iamwrap<divclass="content">iamcontent</div></div><divclass="edge">iamedge</div></div><divclass="footer"><p><ahref="http://fly.layui.com/">Fly社区&...
layui表单与原生js表单的一些小问题（三）
获取table中当前行的某一项的值（innerHTML）varvalue=$(this).parent().parent().find("td")当你通过js代码自动生成DOM元素时，可能会发现生成的button监听不到，先看代码：vart="<trclass="+data.field.classs+"><tdstyle='display:none'>"+data.field.classs+"</td><td>"+data.field.color+"</td><td>"+data.field.size+"</td><td>"+data.field.stock+"</td><td><buttonclass='layui-btnlayui-btn-dangerbtns'>删除</button></td></tr>"$('.tables').append(t)两种解决办法：/*点击删除按钮*/1.$(document).on(...
layui表单与原生js表单的一些小问题（二）
layui表单添加验证：之前写过，链接如下1.layui自带表单验证：https://www.cnblogs.com/a973692898/p/11577502.html2.layui使用自定义表单验证，正则表达式：https://www.cnblogs.com/a973692898/p/11683733.html原生的表单验证：示例如下：DOM：<form><inputtype="hidden"name='classs'class="ids"value="0"/><divclass="block"style="float:left;"><label>颜色<label><inputtype="text"class="gb_color"name="gb_color"placeholder="颜色"/></div><divclass="block"style="float:left;"><label>尺寸<label><inputtype="text"class="...
layui表单与原生js表单的一些小问题（一）
首先先说一下layui吧在layui的form表单中，我们可以通过监听按钮点击，获取到，当前表单中的所有key和value例如：需要各位自己去引入layui的js和css咯HTML代码：<formclass="layui-form"action=""><divstyle="float:left;"><inputtype="hidden"name='classs'class="ids"value="0"/><divclass="layui-form-iteminputs"><divclass="layui-inline"><labelclass="layui-form-label">颜色</label><divclass="layui-input-inline"><inputclass="layui-inputcolor"name="color"lay-verify="required|chinese"/></div></div></div>&l...
监听layui中的table中的td点击事件
上图 就是用layui生成的一个table表格;在这里我们给td绑定class,再通过jq的方式去监听是不可行的;会监听不到事件;不过在layui中,给了监听方法,并且还可以获取到该行所有的数据;<tableclass="layui-table"id="listTable"lay-filter="test"cellpadding="0"cellspacing="0"></table>如上图中的代码;我们给table中属性lay-filter为test;那么监听tr(行点击事件)如下:table.on('row(test)',function(obj){ console.log(obj)})而监听td事件的话,我们需要在cols中添加event事件: 然后:table.on('tool(test)',function(obj){ letevent=obj.event; if(event==seepage){ //监听触发的事件 }}) ...
layui table表格字段过长，鼠标放到上面展示完整信息
table.render({cols:[[{checkbox:true}//多选框,{field:'id',title:'ID'},{field:'name',title:'名字'}]],done:function(res,curr,count){tabTitle();//调用方法}});tabTitle方法：functiontabTitle(){$('th').each(function(index,element){$(element).attr('title',$(element).text());});$('td').each(function(index,element){$(element).attr('title',$(element).text());});}; ...
layui 将json字符串以表格的形式展现出来
先看下Json数据：[{"name":"定/即时采集","code":"TIMER","value":"11111aaa"},{"name":"设备管理员","code":"MANAGER","value":"2222bbb"},{"name":"设备位置","code":"LOCATION","value":"3333ccc"},{"name":"用电属性","code":"POWER_ATTR","value":"44444dddd"}] 在layui中，我们需要将这种json数据的格式转换成数组格式： 存放进data中去然后以这种格式发送到前台；前台就可以通过layui的方式将这个json数据以表格的形式显示出来了： 通用的列表格式：<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>Layui</title><metaname="renderer"content="webkit"><meta...
layui显示页面，将某些字段在条件下改变颜色。
{field:'versNo',title:'版本号',align:'center',templet:function(row){if(row.isNewest==1){varstr='<a>'+row.versNo+'</a>'returnstr;}returnrow.versNo;}},{field:'isNew',title:'是否最新',align:'center',templet:function(row){if(row.isNewest==0){return"历史版本";}elseif(row.isNewest==1){return'<a>最新版本</a>';}else{return"不知道";}}}...
关于layui sort只排序当前页的问题
done:function(res,curr,count){currentPage=curr;varcount=0;$(".layui-unselect").unbind('click');$(".layui-unselect").find("span").eq(0).css('cursor','default');$("._showTunnel").on('click',function(){console.log($(this).is(":visible"));if(count%2==0){$("._xl").show();}else{$("._xl").hide();}count++;})} $(".layui-table-sort-desc").css("border-top-color","#000");//监听排序事件table.on('sort(test)',function(obj){//注：sort是工具条事件名，test是table原始容器的属性lay-filter="对应的值"table.reload('listTable',{initS...
layui表单页面编辑字段
首先呢，咱们在页面的显示表单中添加2个属性，如图： 可以看到标红的字段哈，然后现在页面上的字段是可以的编辑的了，如下图： 但是，现在还是不能修改的，必须要写上监听事件：table.on('edit(test)',function(obj){varreg=newRegExp("^[0-9]*$");//varhex=newRegExp("^#?([a-f0-9]{6}|[a-f0-9]{3})$/");varvalue=obj.value,//得到修改后的值data=obj.data,//得到所在行所有键值field=obj.field;//得到字段varold=$(this).prev().text();//旧值if(field=="unit"&&!hex(obj.value)){obj.update({unit:old});layer.msg('修改失败、请输入16进制的值',{"icon":2,"time":2000});}else{varnow_date=newDate();varjsonEntity={};jsonEntity["...
layui注册页面
写了一个layui的注册页面；常用的几种input框都写进去了，额。我设置的基本上都是必填，大家能用到，直接拿去用就好了先给个图：代码如下：<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title></title><scripttype="text/javascript"src="js/jquery-3.3.1.js"></script><scripttype="text/javascript"src="layer/layer.js"></script><scripttype="text/javascript"src="layui/layui.all.js"></script><linkrel="stylesheet"href="layui/css/layui.css"/></head><body><div><inputid="butt"ty...