
笔记
Jiang酱~
小小白
展开
-
记录——css控制颜色的方式
css控制颜色的方式转载 2021-08-04 17:20:12 · 304 阅读 · 0 评论 -
JS提取富文本内容中的纯文字
//转意符换成普通字符function convertIdeogramToNormalCharacter(val: string) { const arrEntities = {'lt':'<','gt':'>','nbsp':' ','amp':'&','quot':'"'}; return val.replace(/&(lt|gt|nbsp|amp|quot);/ig,function(all,t){return arrEntities[t];});}// .原创 2021-08-02 09:11:53 · 6710 阅读 · 1 评论 -
Ant)-Form 设置表单字段值的格式
setFieldsValue的参数结构是这样的{ field1: field1的值, field2: field2的值,}setFields的参数结构:{ field1: { value: field1的值, errors:错误信息数组 }, field2: { value: field2的值, errors: 错误信息数组 },}...原创 2021-05-26 18:16:01 · 646 阅读 · 0 评论 -
前端:接口请求格式 + 关于接口400的问题
以下是在 React + umi 项目中的案例接口的请求格式基本如下:需要注意各类型接口传参的方式: “return request”里面传递params1)params不会拼接到路由上data: params,2)这个会把params拼接到路由上。eg:params: {…params,},GET请求export async function getDefaultScoreSettings(options?: { [key: string]: any }) { retur原创 2021-05-11 16:54:12 · 1094 阅读 · 0 评论 -
[WIN10 ] 本地部署Easy Mock(node版本控制)
本地部署Easy Mock(很全套,填很多坑)原创 2021-04-22 13:30:33 · 390 阅读 · 2 评论 -
记录关于 async + await 的使用
新的改变关于 async + await 的使用一般是调用异步方法的时候加一个await,然后就能得到异步方法的返回值:const data = await getStatusOfUser();await是把异步方法转成同步方法,所以调用的这句代码的行为(const data = awaitgetStatusOfUser();)就变成异步的了,需要给外层函数加上async关键字 const func = async () => { const data = await ge原创 2021-04-22 12:08:51 · 259 阅读 · 0 评论 -
把图片的url转为base64编码(单张的)
getBase64 () { // 转一张图片编码 var img = 'https://img.alicdn.com/bao/uploaded/TB1qimQIpXXXXXbXFXXSutbFXXX.jpg' var image = new Image() image.crossOrigin = '' // 解决跨域问题 image...转载 2019-10-12 17:46:27 · 1499 阅读 · 0 评论 -
touch事件( 手机端拖拽提示图标 )
参考博客:https://www.cnblogs.com/hpuzy0127/p/5073844.html这次的大作业里面想用 touch事件 做一个在移动端可以拖拽的小图标,嘿嘿,但是还没用到过,然后就参考学习了它的用法。下面就记录下实现此功能的代码吧~总的来说 移动端的touch事件 和 PC端的移动拖拽事件的原理一样:touchstart事件 ———— onmusedown...转载 2019-06-30 20:41:54 · 941 阅读 · 0 评论 -
【转】js中关于!+[]+[]如何进行计算
原文链接:https://blog.youkuaiyun.com/mm_hello11/article/details/83031686看完上面的连接就会做下面这道题啦:要点:js是弱类型语言,所以它会进行隐式类型转换,转换成字符串。(!+[]+[]+![]).length=9...转载 2019-06-24 20:47:16 · 390 阅读 · 0 评论 -
纯前端实现发送电子邮件功能——formspree
我想实现发送邮件的功能但是又不了解后台,正愁着我该怎么写这个功能,然后就发现了一个好东西——formspree 。它相当于一个第三方平台帮我们把表单信息提交发送到我们指定的邮箱里。只不过每次提交表单都需要有信息验证环节,有点点麻烦,而且 但是 它不适用于所有的邮箱(至少QQ邮箱是没问题的)。我参考的资料有:https://blog.youkuaiyun.com/Abez_c/article/detail...转载 2019-06-23 19:21:06 · 12462 阅读 · 3 评论 -
用localStorage存储/读取历史记录相关数据(数组—字符串—数组)
把这次使用localStorage的例子记录以下:思路:我主要是将每次计算的结果及相关参数存到一个数组中,然后将数组通过localStorage.setItem(“allRecord”,JSON.stringify(aRecord));的方式将数组转为字符串存进localStorage;再通过JSON.parse(localStorage.getItem('allRecord"))将字...原创 2019-06-17 00:10:43 · 1918 阅读 · 0 评论 -
用 wow.js + animate.css 实现页面元素的动画效果
之前一直想写这个效果,这次找到啦,跟大家分享下~想要具体的可以看最后的演示及下载,这里我只列了关键的一个点。用法需要引入2个文件:<!--css--><link rel="stylesheet" type="text/css" href="https://www.jq22.com/jquery/animate-3.1.0.min.css"><!--js...原创 2019-06-10 09:55:30 · 513 阅读 · 0 评论 -
自制input样式(动画)
我目前只模仿了一种,后期右的话还会继续加进来的。有动画效果的,截屏看不出来HTML:<div class="input-group"> <input class="input__field" type="text" id="input-1" onblur="inputBlur(this)"/> <label class="inpu...转载 2019-06-10 09:39:05 · 515 阅读 · 0 评论 -
用datatimepicker日期插件实现限定日期范围
自己刚学bootstrap框架,因为项目要求直接从别人的博客里学了下这个datatimepicker日期插件,纯属赶鸭子上架。自己之前百度过很多不同方法,可能因为导入的bootstrap的css,js,和datetimepicker的css,js文件版本不同,都无法正常使用,一直会报错。我下面用的方法是从以为博客主那儿学到的:(他的博客地址:https://blog.youkuaiyun.com/qq_3...原创 2019-03-31 20:00:23 · 1074 阅读 · 0 评论 -
解决 li 浮动后仍无法排列在一行的问题
问题:在做横向动画轮播图时,给 li 设置了 float:left; 但发现 ul 里的 li 还是会竖直排列,效果如下:原因:ul 的宽度不够或未设置宽度解决办法:li 浮动,则给 ul 设置足够大的width:li 不浮动,通过设置ul 和li 的display + ul 的 white-space:nowarp; 让 ul 的内容不换行...原创 2019-04-11 11:19:18 · 3596 阅读 · 0 评论 -
解决datatimepicker日期插件在移动端自动右浮动问题
问题:Datatimepicker日期插件在PC端使用时,显示日期的表位置正常,但在自适应到移动端后发现它自动新增了一个类 pull-right 和 style属性,导致日历的最左边一列被隐藏了。如下,玫红色阴影处:PC端(正常显示的位置):移动端(红框里是新增的):使日历表向右浮动,原本是靠左的解决方法:用jQuery去除pull-right 和 style属性(style属...原创 2019-04-22 09:00:57 · 441 阅读 · 0 评论 -
JS实现放大镜功能
我是看完教学视频做的,一开始发现自己能实现放大,但有个小bug:显示的位置不大对应,原因:mask,box(=小图的宽),big,bImg的宽不能随便设置,需按照比例,否则mask覆盖区域与显示出的大图区域不符。它主要有2个比例关系: //放大显示区域的对应比例=====在CSS里设置 mask的宽 / box的宽 = big的宽 / bImg的宽 //大图对应移动(鼠...原创 2019-04-22 09:33:00 · 12574 阅读 · 1 评论 -
用jQuery实现旋转木马效果的轮播图及解决按钮的闪烁问题
总效果:代码主结构:<body><div class="slide-warp"> <ul class="list"> <li><a href="###"><img src="images/slidepic5.jpg" alt=""></a></li> &l...原创 2019-04-28 19:43:36 · 873 阅读 · 1 评论 -
getComputedStyle与currentStyle
作用:获取元素的样式,但不能设置样式好处:(与offsetLeft相比)offsetLeft获取到的值只有在left要与position搭配(脱离文档流)时才有效,所以有时候靠offsetLeft获取的值不一定准确。但getComputedStyle与currentStyle方法是只要元素的属性 left 被赋值,就能获取出相应的值区别:getComputedStyle:谷歌,火狐支持cu...原创 2019-04-25 14:31:00 · 305 阅读 · 0 评论 -
简单的video切换视频播放列表(每次都先播放广告)
播放的顺序:我想实现的是让它先自动播放广告,广告结束后再播放指定的视频内容。如果切换了指定的视频内容,还是要先播放广告,再放指定的视频内容。实现思路:把要播放的视频地址存放到一个数组 videoList 中。videoList [0]存放广告地址,videoList [1]存放指定播放的视频地址。用curr变量控制播放数组的内容。因为我默认一开始就是从广告播放的,所以curr的初始值赋值...原创 2019-05-19 21:09:57 · 2462 阅读 · 0 评论 -
用canvas实现的弹幕效果
学习网址:https://www.zhangxinxu.com/wordpress/2017/09/html5-canvas-video-barrage/它写的功能和很全面,我只用到了其中的一点点。大家可以好好去看一看。使用之前要先导入一个js文件:(具体内容可去参考上面的网址) <script src="js/canvasBarrage.js"></script>...转载 2019-05-19 21:35:10 · 1403 阅读 · 0 评论 -
jQuery的offset().top与JS的offsetTop的区别
这是我在做播放器的水平方向和竖直方向的拖拽进度条遇到的问题。一开始我老想着这两个方法的效果应该是一样的,结果就被它搞了很久很久。后来我发现这两者的区别其实就是对象的作用域不同(不知道这么说行不行)这里我就拿offsetTop举例子jQuery的offset().top它获取的值==你获取的元素的上边框距离可视区域的顶部的值JS的offsetTop它获取的值==你获取的元素的上边框距离与它...原创 2019-05-13 10:36:42 · 1880 阅读 · 0 评论 -
如何准确获取元素的高度
$(“element”).height()获取的元素高度不准确!!!!我在动态获取元素的高度时,发现用$(‘div’).height()获取到的高度会随着浏览器的变化而变化。所以我在通过这个值动态设置另一个div的高度时就有问题了。解决方法:用 $(“element”).get(0).scrollHeight 或 DOM.scrollHeight 可以正常获取,它的值不会改变的,可以放...原创 2019-05-26 17:06:04 · 3207 阅读 · 0 评论 -
html转jsp无法加载图片问题(已解决)
前几天我遇到这个很奇怪的问题,在html里图片都能正常显示,后来为了连数据库,就把html转成jsp文件,结果只有部分图片能显示,其余的都不能正常显示。关键是我的写法和同学的一样啊,她的都正常。正常显示的图片:无法加载的图片:百度后得知在jsp里图片无法正常加载一般就2个原因:图片路径不正确;被拦截器拦截了;但是经过排查,这2个问题我都不存在,然后又想了很久很久,很久很久,终于...原创 2019-06-03 10:15:39 · 3396 阅读 · 1 评论 -
多级评论回复功能(纯前端,未连数据库)
效果图:html结构(css我就不放了): <div> <!--我的评论--> <div class="my-comment"> <textarea class="textarea" name="" id="" cols="30" rows="10" placeholder="快来说点什么吧~"></t...原创 2019-06-03 11:00:59 · 7495 阅读 · 18 评论 -
点击input框不出现光标
从视觉效果上就是让input看起来不像input,只需2步:readonlyunselectable=“on”eg:<input class="imitationSelect" type="text" value="中小城市" readonly unselectable="on">...原创 2019-06-10 09:21:06 · 7040 阅读 · 0 评论 -
jQuery实现用伪元素给元素加样式
直接上例子吧:用jQuery改变元素 a 的伪元素的样式,用append的方式即可$(this).find("a").append("<style> .mobile-active::after, .mobile-active::before{ opacity:1 }</style>");...原创 2019-06-10 09:29:30 · 2390 阅读 · 0 评论 -
JS—综合移动轮播图
这个轮播图我时跟这学习视频做的:功能:下标索引+左右按钮+无缝轮播(首尾相连)+自动轮播注:1:无缝轮播——若想要显示5张图,那么应该在后面再加一张图(内容为第1张图),共显示6张图。通过元素创建加图,如下,不要直接写在ul标签里,不然下标索引也会相应增加哦 ulObj.appendChild(ulObj.children[0].cloneNode(true));2:索引 pic ...原创 2019-04-04 17:34:11 · 200 阅读 · 0 评论