- 博客(58)
- 收藏
- 关注
RSS订阅原创 Leaflet.Canvas-Markers 交互错位问题
在使用marker标记使用了iconAnchor属性后 图标的交互范围会发生偏移，修改src/plugin/leaflet.canvas-markers.js。如需修改缩放动画，github已经有解决方案。修改 _addMarker 方法。修改_drawImage 方法。修改 _redraw 方法。
2025-03-07 10:35:27
217
原创 vue2项目中可选链报错
这是需要安装babel依赖@babel/plugin-proposal-optional-chaining,并添加到babel.config.js中。注意上面信息，错误来源是 node_modules/@open-wc模块下的文件。这个时候还需要在vue.config.js中添加如下配置,添加所有报错的模块。在babel.config.js中添加如下配置。这个时候还可能会报如下错误。这样就可以正常运行了。
2024-07-19 10:53:52
688
原创 vue2项目 运行 import.meta 报错
void 0 : _import$meta.url)这一句代码中，是因为使用了 import。低版本的node环境不支持。在vue2老项目中，运行时报错，错误定位在 defined((_import。在vue.config.js中添加配置。
2024-07-19 10:53:22
1343
1
原创 解决无catch回调promise失败会导致程序报错问题
注意使用场景，因对失败情况做统一处理，避免开发过程中 因失败情况导致一些错误难以排查。对与以上使用遇到的问题，对promise进行了再次封装。使用 myPromise 重新封装请求。此时请求失败控制台会有以下报错。平时我们封装的api请求。你必须对请求失败做处理。
2024-03-29 16:39:34
471
原创 typescript Constructor Set requires ‘new‘
使用typescript的class继承时报错 “构造函数集需要’new’”只需要在tsconfig.json文件中添加以下配置即可。
2023-06-30 18:23:37
645
原创 flexble.js自适应布局
flexble.js自适应布局一，flexible.js 的使用方式：（一），引用方式（二），flexible.js原理（三），把视觉稿中的px转换成rem一，flexible.js 的使用方式：github地址：https://github.com/amfe/lib-flexible官方文档地址：https://github.com/amfe/article/issues/17本文中有部分内容引至上面这个文档。（一），引用方式1，引用cdn地址<script src="http://g
2022-03-04 20:27:41
791
原创 vue-cli代理服务器
vue-cli代理服务器配置详解在vue.config.js中写如下配置module.exports = { devServer: { proxy: { // /api为代理服务器前缀，例如项目中的请求地址为http://location:8080/api+参数 '/api': { target: '<url>', // 需要请求服务器地址 pathRewrite: {'^/api',''}, // 将请求地址中api替换为空
2022-02-16 21:27:57
453
原创 防抖节流函数
防抖节流函数备份防抖节流函数，防抖函数非立即执行： delay时间内，点击的最后一次执行函数，需要等待delay时间后才执行fn立即执行：立即执行，需要delay时间后才能执行下一次fn/** * @param {Function} fn 需要执行的方法，因this指向问题，建议不使用箭头函数， * @param {Number} delay 间隔时间，默认值100 * @param {Boolean} promptly 是否立即执行，默认false * **/const debounc
2021-11-09 17:52:27
97
原创 js实现sticky粘性定位
var dom = document.querySelector('.count_money'), domTop = dom.offsetTop; window.addEventListener('scroll',scrollFunc) function scrollFunc() { // 定位底部 if(window.pageYOffset < domTop - window.innerHeight){ ...
2021-10-20 11:53:36
1001
原创 HTML onclick 绑定事件阻止冒泡
HTML onclick 绑定事件阻止冒泡<li class="add" onclick="click(this)"></li> function click(elem) { var even = window.event || arguments.callee.caller.arguments[0]; even.preventDefault(); even.stopPropagation(); }...
2021-08-20 17:43:48
1579
原创 uniapp踩坑避雷
uniapp踩坑避雷在uniapp中一个循环内不能fliter（过滤器）和 自定义 v-model 一起使用，小程序端，自定义组件内获取不到 v-model 传递的值。使用属性传值的方式错误写法应使用这种写法
2021-08-03 18:38:04
280
原创 优惠券样式
优惠券样式使用css实现下图的优惠券样式拆分样式这个优惠券样式由凹圆和凸圆组成，凹圆可以使用mask来实现，凸圆可以用背景来实现；由于使用了mask后块超出mask的部分会被减掉，所以将凹圆和凸圆分为两个块样式（利用伪类before和after）实现凹圆附上大神优惠券样式【仅凹圆】详细教程 https://juejin.cn/post/6945023989555134494-webkit-mask: radial-gradient(circle at 15px,#0000 15px
2021-06-23 17:00:18
759
原创 原生js 跑马灯
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>跑马灯
2021-06-10 18:12:46
202
原创 css 实现多行展开收起自动隐藏（全兼容）
css 实现多行展开收起自动隐藏（全兼容）学习笔记<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.
2021-05-23 00:01:38
896
原创 动画库收藏
https://codepen.io/Tibixx/pens/public?cursor=ZD0wJm89MSZwPTEmdj0yMjkyMjY4Mg==
2021-02-02 17:40:28
104
原创 转换函数 processfn（笔记）
//箭头函数 const processfn = data => {} //解构赋值 //数组 const [a,b] = [1,2]; // a=1,b=2; //对象 const {key,value} = {key:'name',value: '小明'} // key = 'name',value = '小明' // 扩展运算符 const data = { key: 'name', value: '小明' } const data2 = { ...da...
2021-01-29 10:31:51
126
原创 文本两端对齐
width: 100px; display: block; text-align: justify; text-align-last: justify; text-justify: distribute-all-lines; //兼容ie
2020-12-28 10:38:37
327
原创 阻止冒泡无效问题
经常遇到用js渲染的div，绑定事件需要用到事件委托，此时阻止冒泡不能使用在时间委托中实现，比如// 这种方法无效，阻止不了冒泡$(document).on('click','#id',function(event) { event = event || window.event; event.stopPropagation();})正确的写法是// 这是正确写法$(document).on('click',function() { $('#id').on('click',functio
2020-12-07 11:57:39
1638
原创 原生js自定义下拉框
原生js自定义下拉框，可以设置下拉框中链接跳转，仅需在option中设置type为jump，设置url为跳转地址即可<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>自定义下拉框se
2020-11-26 15:29:45
1694
原创 获取浏览器地址栏内容
w3school 地址https://www.w3school.com.cn/js/js_window_location.asp
2020-11-25 23:15:09
241
原创 浏览器当前页面前进后退
history.back() //后退一个页面history.forward() //前进一个页面// 指定页面，前进一个页面传1，后退一个页面传-1// 以此类推history.go(X)
2020-11-25 23:08:19
116
原创 判断浏览器
在这里插入代码片//判断是不是IE浏览器使用//('ActiveXObject' in window),//ActiveXObject是IE浏览器特有的属性if('ActiveXObject' in window) { alert('我是ie浏览器');}else { alert('我不是IE浏览器');}//完整的判断是var ua = navigator.userAgent;if(/firefox/i.test(ua)) { alert('我是火狐浏览器');}else
2020-11-25 22:59:03
80
原创 关于取消浏览器默认事件方法
return false； 该方法不适用用两种情况，1.在ie中不支持使用；2.使用addEventListener()方法绑定的响应函数不支持使用event.preventDefault() 该方法是使用addEventListener()方法绑定的响应函数时使用；在ie中取消默认事件，可以使用事件捕获来实现obj.setCaptrue(); 将下一次点击事件捕获到obj，obj.releaseCapture();取消捕获...
2020-11-24 23:48:28
636
原创 拖拽功能（取消浏览器默认事件兼容问题）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box1 {
2020-11-24 23:01:48
705
原创 鼠标滚轮事件
/* 给dom对象绑定鼠标滚轮事件，使用onmousewheel事件，但是火狐浏览器 * 不支持这个事件，火狐浏览器使用DOMMouseScroll事件来绑定鼠标滚轮事* 件，且必须用addEventListener来绑定事件* /obj.onmousewheel = function(event) { /* 其他浏览器使用event.wheelDalte 来获取鼠标滚动方向， * 当event.wheelDelte > 0 时是向上滚，event.wheelDelte < 0 时
2020-11-24 22:36:43
143
原创 绑定响应函数的几种方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box {
2020-11-24 00:18:45
289
原创 事件委托
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box {
2020-11-23 23:24:16
75
原创 阻止事件冒泡
//使用event.cancelBubble = true 来取消事件冒泡，cancelBubble 属性是IE浏览器有的，但其他浏览器也能使用
2020-11-23 23:11:53
78
原创 获取滚动条滚动距离兼容写法
在chrome中，浏览器的滚动条是属于body的，可以通过document.body.scrollTop来获取垂直滚动距离，document.body.scrollLeft来获取水平滚动距离，火狐等浏览器中，浏览器的滚动条是属于html的，通过document.documentElement.scrollTop来获取垂直滚动距离，document.documentElement.scrollLeft来获取垂直滚动距离，兼容写法应该是var top = document.documentElem
2020-11-23 23:06:14
472
原创 事件对象event兼容写法
在IE8及其以下，响应函数被触发时，浏览器不会传递事件对象event，它们是将事件对象作为window对象的属性值保存的，应该使用window.event，window.event 不兼容火狐var div = document.geiElementById('div');div.onclick = function(event) { //event 不兼容IE 8及其以下， event = event || window.event; //if(!event) { // event = wi
2020-11-23 22:59:14
195
原创 jq跑马灯
html块 <div class="hdle"> <div id="line"> <div class="item"> <a href="" style="width: 100%;" target="_blank" class="txt" >******</a>
2020-11-04 17:32:56
171
原创 ios 有动画的定位块，滑动抖动问题
ios 有动画的定位块，滑动抖动问题在ios浏览器中，我底部用两个fixed定位块，没用动画的定位块页面滑动没问题，就有动画的定位块有会抖动，经过排查，发现导致问题的是动画的元素，删除动画后就不会抖动了，也可以在动画元素添加transform： translateZ（0）；-webkit-transform： translateZ（0）；样式就可以解决，在fixed元素上无效...
2020-09-30 18:02:51
493
原创 js写入缓存和读取缓存
js写入缓存和读取缓存写入缓存读取缓存写入缓存localStorage.setItem('name',data); //缓存名称为name，值为data 的数据如果要给缓存设置有效期，可以在数据中存上时间戳进行计算有效期读取缓存localStorage.getItem('name') // 读取缓存名为name的值...
2020-09-01 11:37:20
3032
原创 css3 禁止点击
禁止点击div pointer-events: none; //想要后代元素点击，添加pointer-events: auto;值auto与pointer-events属性未指定时的表现效果相同，对于SVG内容，该值与visiblePainted效果相同none元素永远不会成为鼠标事件的target。但是，当其后代元素的pointer-events属性指定其他值时，鼠标事件可...
2020-04-09 10:15:35
389
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人