![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
麦兜仪
我的笔记不保证正确的
展开
-
layui 关于图片
关于图片上传//HTML <div class="layui-form-item"> <div class="layui-form-label">主图</div> <div class="layui-upload" id="mainPic"> </div> </div>//js var mainPic原创 2021-05-13 15:29:45 · 299 阅读 · 0 评论 -
接口拿到的数据通过select下拉框如何回显
之前做项目的时候遇到一个问题 就是从ajax后台拿到的data数据里每一条数据的id都是一样的 可是后来不知道怎么解决的 就没管了.... 但是今天在做项目的时候遇到了bug 通过接口动态添加select下拉框选项的时候 通过父页面拿到相应id了但是试过好多方法回显不成功 并且不管我选择哪一个选项 提交表单的时候总是拿到某一个id而不是我选的那个 更神奇的是在控制台看 发现我拿到的下拉框接口的数据页数每一条id都是一样的 额....似曾相识..但是好在最后找到原因了 :原创 2021-05-11 18:39:46 · 1459 阅读 · 2 评论 -
麦兜兜要记住踩过的坑
单引号和双引号要交替使用-一定一定要记得加上break 要不然就会一直执行 甚至跟后来的事件一起执行 !switch(){case "":break; //很重要!}原创 2021-05-09 16:37:43 · 73 阅读 · 0 评论 -
git的常用
git下载别人的代码1>到仓库里复制 2>找到要放代码文件的地方 右键"git bash here"3>在弹出的框里 输入 git clone "此处是粘贴在官网复制的地址" (右键点击pase)原创 2021-05-09 15:12:01 · 53 阅读 · 0 评论 -
从父页面点编辑的时候回显下拉框的数据回显不成功的问题
原来的写法在别的项目写是可以的 不知道什么原因在这里就不可以 不过还好在同事的帮助下换了另一种写法解决了 成功的代码如下:重点: $(’#status’).val(data.status)$(’#sex’).val(data.sex)<--下拉框HTML结构--><div class="layui-form-item"> <label class="layui-form-label">性别</label> ..原创 2021-05-08 11:26:50 · 451 阅读 · 0 评论 -
layui 图片返回数组形式转义渲染
图片返回数组形式转义场景:做项目时发现后台返回的是数组形式的图片 所以不能直接拿到单张图片的地址 所以要先通过 遍历数组拿到单个地址 再用div和img标签包起来 templet: (d) => { if (d.buyPics) { let buyPics = d.buyPics || []; let原创 2021-04-29 09:31:47 · 232 阅读 · 0 评论 -
layui 日期与时间 的bug(小屏幕一闪而过没效果)
日期与时间 的bug笔记://HTML<div class="layui-input-inline"> <input id="starttime" name="starttime" type="text" autocomplete="off" class="layui-input" placeholder="请输入" lay-verify="required"></div>//挂载的如果放在别的layui.use里面没效原创 2021-04-28 14:19:19 · 249 阅读 · 0 评论 -
layui 新增或修改同一个接口做法
笔记:例子:E:\麦兜的文件\haguliAdmin\views\business\Video\videoActivityEdit.html 例: content: ['videoActivityEdit.html?result=' + objdata.id] 再传过来 用if判断 分别实现两种功能 表单写法: <div class="content"> <form id="form" class="layu原创 2021-04-27 17:07:05 · 889 阅读 · 2 评论 -
layui bug 踩坑 集锦 (更新)
layui表单提交请求Ajax的时候被浏览器canceled返回的原因可能是因为表单提交事件和表单默认提交事件冲突了 因此一定要记得在表单提交的时候 指定一种类型type="button" 如: <button class=" layui-btn" type="button" lay-submit lay-filter="formSubmit" permission="sys:item:addoredit">提交</button>...原创 2021-04-27 17:02:03 · 591 阅读 · 0 评论 -
layui 列表 模板
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>哈咕哩商品列表</title> <link rel="stylesheet" href="../../../static/layui/css/layui.css" media="all" /> <link rel="stylesheet" href原创 2021-04-26 19:33:26 · 1087 阅读 · 0 评论 -
layui-只有一行数据的表格拿到数据却没有成功渲染的原因
后台返回的data 里的result 不是数组的形式 而是以对象的形式包起来了有可能是因为只有一行数据 后台就不用数组包起来了 但是这会造成我们的页面 渲染不出来解决方法很简单 只需要将拿到的data.result 用[]包起来再传参给表格就可以//关键 createTable([res.result]) function createTable(data) { //表格 layui.use('table', function() { table.rend原创 2021-04-23 19:10:09 · 863 阅读 · 0 评论 -
layui跳转同一个子页面注意事项
点击事件跳转同一个子页面注意事项1.在父页面给跳转的url地址content一个状态 content: ['./goodsEdit.html?stause=1'],2.在子页面获得父页面给的状态 var param = getUrlParam().stause; //获取传递过来的参数3.根据状态判断要显示的是哪些数据 if(param) { } else {}...原创 2021-04-21 19:15:02 · 374 阅读 · 0 评论 -
layui 关闭弹窗 刷新页面
关闭弹窗//要在本页面,同一个页面 才能用 var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index);//跳转了的页面用这个 setTimeout('window.parent.closeLayer()', 300)原创 2021-04-21 15:44:45 · 1377 阅读 · 0 评论 -
layui 子页面用parent()拿到父页面的数据并回显数据
layui 子页面用parent()拿到父页面的数据并回显数据//父页面 定义一个全局变量来获取到表格当前行的数据 var objdata; //工具条操作按钮事件 table.on('tool(categories)', function(obj) { //注:tool 是工具条事件名,test 是 table 原始容器的属性 lay-filter="对应的值" var data = obj.data; //获得当前行数据 objdata = data;原创 2021-04-21 14:49:16 · 3069 阅读 · 2 评论 -
点击按钮创建事件
点击按钮关闭弹窗 //例如 //点击提交按钮关闭页面 $('#but').bind('click', function() { console.log(this) var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); })...原创 2021-04-21 10:37:09 · 110 阅读 · 0 评论 -
layui-转义
转义//HTML 在table容器下面写 <script id="statusInfo" type="text/html"> {{# if(d.status == 20 ){ }} <span style="color: #ff0600">{{d.statusInfo}}</span> {{# }else if(d.status==1){ }} <span style="color: #原创 2021-04-20 11:17:18 · 1043 阅读 · 0 评论 -
解决layui表格 宽高不齐的问题
解决layui表格 宽高不齐的问题table.render({done: function() { hoverOpenImg(); //鼠标放上去图片放大 不用研究这个方法 common.js initLayuiTable($("#lay_table"), obj, colsArr); //解决宽高不齐的问题 记得改三个参数(表格id,数据原创 2021-04-20 10:38:42 · 801 阅读 · 2 评论 -
layui- 分页
分页//css /*page分页工具固定底部位置显示*/ .layui-table-page { background: #FFFFFF; position: fixed; bottom: 0; z-index: 19890000; }// HTML <div class="layui-table-page"> <!-- 分页工具 --> &l原创 2021-04-20 10:09:30 · 279 阅读 · 0 评论 -
layui-注意事项
需要放在ready函数里面初始化的页面初始化:一打开页面时需要加载的数据,或者需要执行的动作就先放在$(docment).ready( )页面书写顺序参考//HTML //table模板 <table class="layui-hide" id="lay_table" lay-filter="categories"></table> // <!--操作--> //自定义模板 <scri原创 2021-04-20 10:05:37 · 126 阅读 · 0 评论 -
layui-操作按钮
操作按钮//放在table标签后面<script type="text/html" id="barTool"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> //edit理解用来做事件的标记 <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</原创 2021-04-20 10:01:31 · 1082 阅读 · 1 评论 -
layui表格拿数据的方式
第一种方式 函数传参方式 //一进入页面要先拿到数据, $('document').ready(function() { getData(); }) //把Ajax请求封装成一个函数 function getData() { $.ajax({ url: //服务端的请求地址 type: //http请求方式 get,post,put,de原创 2021-04-20 10:00:22 · 3445 阅读 · 0 评论 -
layui 新增商品 提交submit 笔记
新增1.分析需求 点击新增就能新增2.设计程序 点击新增 弹出编辑新增表单页面 条件按钮 选择活动商品新弹窗表单 //画HTML标签框架 //Ajax 动态拿数据做标题按钮 //点击下拉框继续弹出一个新页面 点击提交按钮把数据传给后台 获取新增的内容 再把命令传给后台 后台保存新增3.代码实现//点击的时候回调一个函数 οnclick="add()" <button permission="s原创 2021-04-18 15:27:18 · 805 阅读 · 0 评论 -
layui-动态 添加 下拉框选项
下拉框选项//html<!-- 下拉选择框 --> <div class="layui-input-inline"> <div class="layui-input-inline"> 按钮名称: </div> <div class="layui-input-inline">原创 2021-04-19 19:14:32 · 2764 阅读 · 0 评论 -
jQuery方法 学到一个做一个笔记 温故而知新
jQuery方法//attr() 方法设置或返回被选元素的属性值//trim()方法去掉空格password:$.trim($('#username').val()),//each() 方法规定为每个匹配元素规定运行的函数。 $(selector).each(function(index,element)) //index - 选择器的 index 位置 //element - 当前的元素(也可使用 "this" 选择器) $("button").cl原创 2021-04-19 16:37:23 · 56 阅读 · 0 评论 -
layui 常用
弹出层标题输入框<div class="layui-input-inline">商品标题: <div class="layui-input-inline"> <input type="text" class="layui-input" id="itemTitle" autocomplete="off"> </div></div>搜索原创 2021-04-18 15:29:22 · 298 阅读 · 0 评论 -
layui 按条件搜索
条件搜索1.分析需求 改变搜索条件和输入商品标题均能按条件来展示表格数据内容2.设计程序 用户选中条件选项 我获取到该选项id 传给后台 让后台返回数据给我展示 点击搜索刷新页面 用户输入标题条件 我获取到该选项id 传给后台 让后台返回数据给我展示 点击搜索重新获取数据刷新页面3.代码实现//需要传参数给后台 用到ajax //获取到用户选中条件的id buttonId: $('#buttonId').val(), itemTitle: $('inpu原创 2021-04-18 15:26:29 · 781 阅读 · 0 评论 -
layui批量取消和单个取消用同一个接口的做法
批量取消和单个取消用同一个接口的做法1.分析需求 //批量取消 点击复选框多选.全选.可以点击批量取消 来做取消动作 没有选中复选框点击批量取消按钮 则弹窗显示 '请选择至少1个的商品数量!' //单个取消 点击弹出层的确定按钮 可以完成取消动作 并关闭弹出层2.设计程序 //单个取消 1.先拿到id 看后台:data.buttonId/ data.itemId 2.点确认请求后台删除接口 只要有动作就会有接口 要交互,调用后台给的删除原创 2021-04-18 11:08:44 · 202 阅读 · 0 评论 -
Ajax请求的一些笔记
Ajax请求服务器失败时用第二个地址访问失败,可以用第一个以下图片控制台的这些要知道是代表什么意思Ajax请求注意事项1/请求成功前必须先按照文档传data参数,而且要将 url: //服务端的请求地址 type: //http请求方式 get,post,put,delete,options headers: //请求头 data: { //键值对 }, 以上4个参数.原创 2021-04-13 16:06:55 · 74 阅读 · 0 评论 -
es6语法
|| let obj = res.result.data || []; //判断||前面的值是否为true(false(undefined\-1\)),为true时选取||前面的数据,否则选择后面的原创 2021-04-13 19:54:00 · 53 阅读 · 0 评论 -
引入了jQuery文件还报错的原因
js文件引入位置有讲究,否则报错上图三个箭头指的JS是自己写的,有些可能用了JQ框架,所以如果把JQ放在这三个下面的话,下面这三个用了JQ的就会报错。所以在引用的时候要注意,看下引用的每个JS是否是独立的还是依赖某个JS,独立的话位置就不会有影响,比如layui.js,但是有依赖的话位置就有影响,比如箭头指的三个JS,就必须引用之前把他依赖的JS引用进来...原创 2021-04-13 14:52:14 · 879 阅读 · 2 评论 -
jQery的 学习目标
jQery的 学习目标1.能够说出什么是 jQuery- jQuery 是一个快速、简洁的 JavaScript 库,即倡导写更少的代码,做更多的事情。- j 就是 JavaScript; Query 查询; 意思就是查询js,把js中的DOM操作做了封装,我们可以快速的查询使用里面的功能。- jQuery 封装了 JavaScript 常用的功能代码,优化了 DOM 操作、事件处理、动画设计和 Ajax 交互。- 学习jQuery本质: 就是学习调用这些函数(方法)。- jQuer原创 2021-04-12 17:51:07 · 467 阅读 · 0 评论 -
JavaScript创建事件
点击按钮创建事件 //例如 //点击提交按钮关闭页面 $('#but').bind('click', function() { console.log(this) var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); })...原创 2021-04-12 16:43:36 · 90 阅读 · 0 评论 -
用layui 碰到的bug
layui 表格只显示10条数据原因:table表格也有一个limit参数用来限制显示数量的,默认10条所以解决方法是 table表格中加上limit参数即可原创 2021-04-12 09:54:10 · 343 阅读 · 0 评论 -
JavaScript 基础
命名规范### 变量命名规范规则:- 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成,如:usrAge, num01, _name- 严格区分大小写。var app; 和 var App; 是两个变量- 不能 以数字开头。 18age 是错误的- 不能 是关键字、保留字。例如:var、for、while- 变量名必须有意义。 MMD BBD nl → age - 遵守驼峰命名法。首字母小写,后面单词的首字母需要大写。原创 2021-04-11 16:41:07 · 28 阅读 · 0 评论 -
jQuery
Ajax请求方法模板 //jquery的ajax请求 $.ajax({ url: "test.html",//服务端的请求地址 type:'POST',//http请求方式 get,post,put,delete,options data:{ name:"张三", number:"4324345333", }, // dataType: 'json', // contentType: 'appliction/json',原创 2021-04-11 16:18:41 · 48 阅读 · 0 评论