![](https://img-blog.csdnimg.cn/20190918140053667.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
前端
layui
零碎記忆
不要跟我比懒,我懒得跟你比~
展开
-
2022-09-22 js判断数组是否为空
使用length以数组的长度来判断数组是否为空。转载 2022-09-22 16:33:50 · 408 阅读 · 0 评论 -
2022-09-20 select的option点击事件
【代码】2022-09-20 select的option点击事件。转载 2022-09-20 14:28:38 · 452 阅读 · 0 评论 -
2022-09-09 立即执行函数
3.立即执行函数最大的作用就是 独立创建了一个作用域,里面所有的变量都是局部变量 不存在命名冲突的情况 可以起名 也可以不起名。(function 函数名() {})() 或 (function 函数名(){}());1.立即执行函数:不需要调用,立马能够自己执行的函数。2.写法 也可以传递参数进来。转载 2022-09-09 11:30:33 · 103 阅读 · 0 评论 -
2022-08-10 layui中form和table同时使用的问题
问题:下面的代码中姓名可展开一个table,table中的搜索按钮默认回验证表单必填,如果必填项都有内容,则会刷新form,导致搜索功能失效。解决:将button的type设置一下可以解决 ,添加代码 type="button"...原创 2022-08-10 14:50:07 · 1139 阅读 · 0 评论 -
2022-07-28 xm-select 的使用
文档。原创 2022-07-28 11:32:41 · 7486 阅读 · 0 评论 -
2022-07-12 ECharts的基本使用
需求:统计数据使用柱形图、饼图展示(数量需要显示转载 2022-07-12 09:44:15 · 867 阅读 · 0 评论 -
2022-06-20 js点击事件嵌套
需求:现有多个列表(li),li有点击事件跳转,li中有一个删除a问题:li中嵌套着a,所以会导致点击a的事件后继续执行li的跳转事件解决:event.stopPropagation();阻止事件冒泡到父元素原创 2022-06-20 15:18:16 · 529 阅读 · 0 评论 -
2022-5-11 layui中radio选中、取值
1.回显选中<input type="radio" name="sex" value="M" title="男"><input type="radio" name="sex" value="W" title="女">//处理性别选中$('input[name="sex"][value="M"]').prop('checked','checked');form.render('radio');2.取值<input type="radio" name="转载 2022-05-11 18:22:55 · 4499 阅读 · 0 评论 -
2022-4-7 layui新建标签页
使用layui新建标签页layui.use(['index'], function () {var index = layui.index;...function (data) { //在新标签页中打开页面 var url = "/test/index?name=" + data.name; var title = "测试页面"; index.openTab({ url: Feng.ctxPath +原创 2022-04-07 20:27:41 · 1035 阅读 · 0 评论 -
2022-03-21 vue页面传值
需求:例,当前有人员表、文件表,文件中存储当前人员的不同类型文件,通过filetype字段区分,编辑时需要传输filetype字段获取相应数据。(在编辑页面的基础上编辑文件表内容)代码:vue自定义传输字段fileType,传输值为"demand"(自定义传输对象 :fileType,方法为"method")<el-button type="primary" @click="edit" fileType="demand">编 辑</el-button>文件表的增删.原创 2022-03-21 17:12:53 · 1159 阅读 · 0 评论 -
layui的tab点击事件
需求:现有(审核、调剂、复核、发药)四个操作需要不同的人去做,通过给对应的人分配权限展示想相应操作问题:由于当前登录人的权限不能确定,tab的中的li会出现问题(只有在点击第一个li之后,后面 的li才能正常点击)解决:使用js实现点击第一个li,找到第一个li并点击这里用到了css的 [父元素:first-child ],ul(父元素)匹配第一个li(子元素)$('#audit-div ul :first-child').click();代码html:通过beetl.原创 2022-01-21 11:19:43 · 2205 阅读 · 0 评论 -
2021-12-27 input禁用
参考文章:1.layui input静止输入功能2.layui标签输入框添加禁止点击标志需求:input输入框不能编辑,鼠标显示禁选标志disabled控制input框不能编辑layui-btn-disabled禁选样式(输入框变灰,并且出现禁选标志;也可以用这个 layui-disabled)<input disabled name="" id="" class="layui-input layui-btn-disabled"/>layui-btn-d转载 2021-12-27 15:55:11 · 1744 阅读 · 0 评论 -
2021-11-24 layui的laydate限制不能选择今天之前的数据
参考文章:layui laydate设置最小时间为当前时间,不能选择今天之前的时间https://blog.csdn.net/qq_33769914/article/details/115513949<input class="layui-input icon-date" id="endDate" lay-verify="required" name="endDate"placeholder="请输入截止时间" required type="text" autocomplete="..转载 2021-11-24 10:45:22 · 1245 阅读 · 0 评论 -
2021-11-21 layui的js中,父页面传值到子窗口
在子页面中使用打印 parent,console.log(parent)parent中包含父页面中的所有属性,在子窗口给父页面的属性赋值后使用原创 2021-11-22 17:01:43 · 229 阅读 · 0 评论 -
2021-11-22 layui使用data参数渲染表格失败
参考文章:layui使用data参数渲染table,页面不展示的问题https://blog.csdn.net/qq_41896159/article/details/108731115js数据类型判断和数组判断https://www.cnblogs.com/mofish/p/3388427.html问题:table.render中的data参数是从子页面获取的数组,数据表格渲染失败;用下方的方式,将data写死,是能正常渲染的 table.render({ .转载 2021-11-22 10:31:32 · 1640 阅读 · 1 评论 -
2021-11-17 layui数据表格
主要使用layui的templet - 自定义列模板,添加跳转链接, templet: function (data) { return '<a style="cursor:pointer;color: deepskyblue;" onclick="Test.openTestDetails(\'' + data.id + '\',\'' + data.name + '\')">' + data.name + '</a>'; ...转载 2021-11-17 16:27:10 · 547 阅读 · 0 评论 -
2021-11-17 layui富文本编辑器的使用(layedit)
参考文章:文档地址layui富文本框layedit的使用及内容的禁用html<textarea id="demo" name="demo" placeholder="请输入内容" class="layui-textarea"></textarea><textarea id="demo2" name="demo2" placeholder="请输入内容2" class="layui-textarea"></textarea>js..转载 2021-11-17 11:14:55 · 1442 阅读 · 1 评论 -
2021-10-09 formSelects-v4.js的使用
使用方式下载formSelects-v4,并引入 html,测试下拉多选框@layout("/common/_form.html",{js:["/assets/test/add.js"],css:["/assets/expand/module/formSelects/formSelects-v4.css"]}){... <input id="ids" name="ids" value="${item.ids}" type="hidden"/> <select转载 2021-10-09 14:14:35 · 1320 阅读 · 0 评论 -
2021-09-29 layui中限制input中输入的必须是正整数且非必填项
参考文章:正则表达式——可以不输入要输入只能输入正整数和正小数,且不为0代码:html:主要使用 lay-verify 进行表单验证<input name="height" class="layui-input" lay-verify="height"/><input name="weight"class="layui-input" lay-verify="weight"/>js...form.verify({ //限制身高不为空的时候,只转载 2021-09-29 17:28:20 · 2172 阅读 · 0 评论 -
2021-09-23 html单行不换行溢出部分以省略号显示,多行文本溢出以省略号显示;内容太多隐藏部分;
参考文章:html单行不换行溢出部分以省略号显示,多行文本溢出以省略号显示https://blog.csdn.net/weixin_42965828/article/details/115184179css单行文字和多行文字溢出隐藏https://blog.csdn.net/weixin_43862991/article/details/107022650实现效果:after代码 .hide{ overflow: hidden;/*多余的文字隐藏*/ ...转载 2021-09-23 17:11:30 · 147 阅读 · 0 评论 -
2021-09-22 layui数据表格的在同一个单元格展示两个数据
layui的静态表格,表头如何自动换行,而不是显示为...?layui数据表格的表头换行:1、修改下表格样式:<style type="text/css"> .layui-table-cell { height: auto; line-height: 28px; padding: 0 15px; position: relative; overflow: hidden; text-overflow: ellipsi..转载 2021-09-22 10:14:20 · 983 阅读 · 1 评论 -
2021-09-09 layui-verify表单验证
官方文档(底部的表单验证)html<input type="text" lay-verify="checkNumLength" />js - 两种方式1.使用正则表达式进行限制 form.verify({ checkNumLength: [ /^.{10}$/ , '比赛CODE只能输入10个字符的长度!' ] });2.条件判断form.verify({ ch原创 2021-09-09 14:20:31 · 520 阅读 · 0 评论 -
2021-09-03 layui 使用dom元素渲染html页面
将showList的内容循环后加入list中<div id="list"></div><script type="text/html" id="showList"> {{d.name}} {{d.sex}}</script>data.forEach(function (item) { $('#list').append(laytpl(showList.innerHTML).render(item));});遍.原创 2021-09-03 18:24:40 · 582 阅读 · 0 评论 -
2021-09-02 js的事件注册
问题:第一次进入页面,单击事件可用,单击之后事件失效原因:由于绑定事件的元素(#delete)是通过<script>追加的,所以要使用需要静态元素(#select)和<script>中的元素配(#delete)合选中例<form> <div id="select"></div></form><script id="selectData" type="text/html"> <i id=原创 2021-09-02 19:22:14 · 70 阅读 · 0 评论 -
2021-08-23 layui给input文本框赋值
参考文章 :layui的表单控件的input文本框赋值html:给要赋值的input设置id<input id="testId" type="text" class="layui-input" ... />js:单击文本框设置内容为 “赋值” $("#testId").on("click", function () { var str = "赋值"; $('#testId').val(str); })//或者是下面的方式$(".转载 2021-08-23 17:21:30 · 8201 阅读 · 0 评论 -
2021-08-10 js判断Object是否为空
参考文章:js如何判断Object是否为空js 判断一个 Object 对象是否为空test ={};$.isEmptyObject(test); //结果为true$.isEmptyObject({}); //true$.isEmptyObject(new Object()); //true$.isEmptyObject({"ID":"1"}); //false//将obj转换成字符串,进行字符串比较:JSON.string转载 2021-08-10 18:14:22 · 209 阅读 · 0 评论 -
2021-08-10 layui折叠面板的使用
官方参考:element模块元素操作文档 - Layui面板 - 在线演示 - Layui实现效果html://在折叠面板的父容器设置属性 lay-accordion 来开启手风琴,那么在进行折叠操作时,始终只会展现当前的面板<div class="layui-collapse" lay-accordion> <div class="layui-colla-item"> <h2 class="layui-...转载 2021-08-10 17:41:27 · 6101 阅读 · 0 评论 -
2021-08-09 layui中使用js修改css样式
修改已有的css样式//test是html中需要修改的样式的id $("#test").css('border-right', '0px');//test是html中需要修改的样式的class $(".test").css('border-right', '0px');原创 2021-08-09 17:00:53 · 1356 阅读 · 0 评论 -
2021-08-05 layui下拉框的点击事件、获得选中的值和文本内容
参考链接:JS实现select选中option触发事件操作示例需求:根据下拉框选中的内容实现对应的操作实现:使用layui的下拉框,添加事件只能通过form.on(...)的形式1.html页面 <select id="status" name="status" lay-filter="onClickSelected" required> <option value="start">开始</option> <option val转载 2021-08-05 18:11:25 · 8953 阅读 · 0 评论 -
路径小记
目录语法同一个目录:index2.html 或./index2.html; 在子目录:xxx/index2.html; 在孙子目录:xxx/xxx/index2.html; 在父目录:../index2.html; 在爷爷目录:../../index2.html;最后,一个要注意的地方是:不管你有没有发现,其实windows和linux系统的路径分隔符是不一样的,windows为 \...转载 2019-03-07 18:03:03 · 126 阅读 · 0 评论 -
jquery下载所有版本
jquery下载所有版本(实时更新):http://www.jq22.com/jquery-info122转载 2019-03-21 10:09:59 · 1623 阅读 · 0 评论 -
jquery-1.11.3.min.js —— jquery库
转载地址:https://www.cnblogs.com/SongHuiJuan/p/8058217.htmljquery-1.11.3.min.js —— jquery库/*! jQuery v1.11.3 | (c) 2005, 2015 jQuery Foundation, Inc. | jquery.org/license */ ! function(a, b) { "o...转载 2019-03-12 15:36:59 · 10227 阅读 · 0 评论 -
文本框提交时不能为空,input输入框的一些功能属性
<input type="" required="required" name="" id="" value="" />加上required 这个属性 ,就成了必填字段 。出处:https://ask.csdn.net/questions/357391原创 2019-03-20 20:02:24 · 12508 阅读 · 0 评论 -
2021-07-30 layui.js:2 Layui hint: The ID option was not found in the table instance
参考文章:layui.js:2 Layui hint: The ID option was not found in the table instance引用layui.table表格重载的时候,发现报错。The ID option was not found in the table instance,意思为:在表实例中未找到ID选项有两个原因:原因1. table的id不匹配(具体参考)原因2. 这个是我遇到的问题,先渲染后重载table.render是渲染表格,tabl.原创 2021-07-30 18:00:50 · 4554 阅读 · 0 评论 -
2021-07-26 layui.util.toDateString的使用 layui的数据表格中显示时间样式自定义 用生日计算年龄
参考文章:layui 日期转换util工具集问题:当要转换的字段为null时,它将转换当前日期解决方式:{field: 'endDate', title: '毕业时间', templet: function (d) { if (d.endDate && d.endDate !== '' && d.endDate !== null ) { //条件必须写完善,否则会出现错误,如:不写undefined 的话,也会默认认转载 2021-07-26 16:06:05 · 2792 阅读 · 0 评论 -
2021-07-23 左侧树
记录左侧树1.引用tree,然后请求接口//引用treelayui.use([... "tree"], function () { ... var tree = layui.tree; // 初始化部门树 var ajax = new $ax(Feng.ctxPath + "/dept/layuiTree", function (data) { tree.render({ elem: '#deptTree',原创 2021-07-23 15:28:52 · 271 阅读 · 0 评论 -
2021-06-25 layui下拉框三级联动
参考文章1.html中和 lay-filter="" 和 from.on() 实现下拉点击事件 <div class="layui-form-item"> <label class="layui-form-label">地址</label> <div class="layui-input-inline"> <select id="province" lay-filter="province" la转载 2021-06-25 17:28:30 · 643 阅读 · 1 评论 -
2021-06-25 layui form.render(‘select‘, ‘test2‘) 更新渲染失效问题
参考链接重点:1、样式 class="layui-form" 要加到div标签,不要加到select标签2、属性 lay-filter="test2" 同样要加到div标签中转载 2021-06-25 16:22:39 · 872 阅读 · 0 评论 -
2021-06-24 layui中多个下拉列表间的禁选和取消禁选
现有大项、分项、小项三个下拉列表,实现功能:默认分项、小项是禁选,在大项选择之后分项取消禁选,分项选择之后小项取消禁选1.添加 lay-filter="sportsTypeParent"div class="layui-inline layui-col-md3"> <label class="layui-form-label">运动大项<span style="color: red;".原创 2021-06-24 17:34:43 · 906 阅读 · 0 评论 -
2021-06-22 layui弹窗layer
layui弹窗转载 2021-06-22 09:50:22 · 1673 阅读 · 1 评论