![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端框架
MartinYangHJ
我的一天天
展开
-
input框中添加一个 X(关闭/清空按钮)
要在输入框( 元素)中添加一个 X(关闭/清空按钮),可以使用 CSS 和 JavaScript 实现。原创 2024-02-05 10:42:51 · 1809 阅读 · 0 评论 -
HTML中div内容垂直居中显示
HTML中要将div元素的内容垂直居中显示,你可以使用 CSS 的 flexbox 或者 grid 布局来实现。下面分别介绍两种方法。原创 2024-01-18 14:48:58 · 1048 阅读 · 0 评论 -
Cesium使用UrlTemplateImageryProvider加载第三方定义的瓦片
/使用第三方定义的瓦片,baseLayer的类型为ImageryLayer。//视野定位到北极中心点。原创 2024-01-10 16:10:49 · 1056 阅读 · 0 评论 -
CSS属性position的值及其意义
CSS属性position的值及其意义原创 2024-01-09 14:39:02 · 381 阅读 · 0 评论 -
echarts环形图内接分类名称并且颜色名称颜色跟随变化
echarts环形图内接分类名称并且颜色名称颜色跟随变化原创 2024-01-04 14:53:52 · 698 阅读 · 0 评论 -
js对大于1000的数字进行英文逗号分隔
在实际开发中,很多时候需要对数字进行样式操作,例如,当数字大于1000时,将数字按照逗号进行分隔:1999999->1,999,999。原创 2023-12-01 13:40:25 · 665 阅读 · 0 评论 -
js去除字符串中的字符
js去除字符串中的字符原创 2023-11-28 15:37:52 · 580 阅读 · 0 评论 -
echarts使用bar组合生成3d柱形图时,两个面之间有间隙解决办法
图中红框范围内的阴影有一个间隙,如何解决这个问题呢?原创 2023-05-09 15:22:06 · 574 阅读 · 0 评论 -
浏览器调试报错plus is not defined
浏览器是不能调试H5+,只能用手机进行调试,相当于在app内置了一个支持html5+的内核,该内核支持plus对象.所以没有plus库,也不用引用库.就像js中我们使用document对象,但从来没有引document库一样的道理。在使用plus时,需要在plus ready后再调用plus。原创 2022-09-09 14:11:42 · 4568 阅读 · 0 评论 -
Vue+axios使用post方法传递参数过长报错问题解决
axios.post(url, null, { params: d })代码段即是解决此问题的方法。如果大家有其他方式,可以提出来供大家作为参考。原创 2022-09-06 17:13:48 · 2744 阅读 · 0 评论 -
element-ui 某些组件绑定事件后不起作用
请看如下代码:<template> <div> <el-col :span="8" @click="clickEvent"> <div @click="clickEvent"> </div> </el-col> <el-row gutter="14" @click="clickEvent"> &原创 2022-04-08 13:35:28 · 1754 阅读 · 2 评论 -
Js去除字符串里面的HTML标签
例如下面一段字符串,想去除里面的HTML标签,怎么办呢?var str="<div style="font-size:15px;">今日评论<br /><span>1.今天好冷啊</span></div>";使用正则表达式,可以快速获取到除Html标签以外的内容var result = str.replace(/<\/?.+?>/g,"").replace(/ /g,"");第一个replace是替换掉所有的HTML标签原创 2022-02-11 17:46:08 · 3913 阅读 · 0 评论 -
jQuery-photoClip裁剪图片部分问题解决
目前网上photoClip裁剪图片的例子使用的jquery版本都比较低,没有3.0以上的,这样如果项目中使用3.0以上的Jquery版本,再使用网上的例子进行图片裁剪时就会报错,无法进行图片裁剪(1)Jquery3.0移除了load()、unload()、error()等方法Breaking change: .load(), .unload(), and .error() removedThese methods are shortcuts for event operations, but原创 2022-01-17 11:09:39 · 678 阅读 · 0 评论 -
echarts如何监听点击图表空白处事件
如下图两处空白,如何监控两处空白处的点击事件监听事件方法,利用getZr()属性获取点击事件var obj = document.getElementById('echarts');var option={ //具体参考echarts官方:https://echarts.apache.org/examples/zh/index.html}var myChart = echarts.init(obj);myChart.setOption(option);// 使用getZr获原创 2022-01-11 16:51:19 · 3031 阅读 · 0 评论 -
VS Code安装Node.js、webpack、vue-cli
下载node.js,进行安装;内置npm,可不用再次安装npm完成后,全局安装webpack,命令为 npm install webpack -g如需安装vue,全局安装vue,命令为 npm install vue-cli原创 2021-09-29 13:39:42 · 160 阅读 · 0 评论 -
layer.open弹出图片大小自适应
layer.open自适应图片大小主要是先获取到图片的width和height,然后设置到layer.open的area里function getImg(imgUrl){ var img = new Image(); //图片地址 img.src = imgUrl; if (img.complete) { var win_w = img.width; var win_h = img.height; openLayer(wi原创 2021-09-18 14:21:04 · 1937 阅读 · 0 评论 -
html页面抖动,晃动的解决办法
如果页面一直在晃或者点击页面某一部分时晃动一下,就是css的问题,解决方法如下://第一种html,body{ overflow-y:scroll;} //第二种html,body{ overflow:scroll; min-height:101%;} //第三种html{ overflow:-moz-scrollbars-vertical;} ...原创 2021-08-27 09:53:49 · 3798 阅读 · 0 评论 -
js清除setInterval、setTimeout
var id=window.setInterval(function(){ doSomething; },1000);window.clearInterval(id);原创 2021-08-16 15:11:27 · 2568 阅读 · 0 评论 -
动态给layui-progress-bar赋值
进度条Html代码:<div class="layui-progress layui-progress-big" lay-filter="number" lay-showPercent="yes"> <div class="layui-progress-bar layui-bg-green" lay-percent="80%"></div> </div>仅仅是上面几行代码,进度条是无法显示的。显示进度分为静态和动态两种。1.原创 2021-06-29 16:29:52 · 1377 阅读 · 0 评论 -
登录时,按下enter键登入
function keyLogin(event) { if (event.keyCode == 13) { $("#login").click(); }}Html代码:<body style="background: #3282db;" onkeydown="keyLogin(event);"> <!--登录页面内容--> <div class="loginBox"> <!--登录页面内容--&.原创 2021-03-26 16:05:09 · 561 阅读 · 0 评论 -
div中中文自动换行,英文或者数字不自动换行解决办法
在div样式中增加如下属性即可:word-break:break-word;<div style="word-break:break-word;">hkjdshfljdsfds</div>原创 2021-03-11 11:07:57 · 944 阅读 · 0 评论 -
Vue 返回上一页报错:Can‘t read property ‘go’ of undefined,this.$router.go(-1)不起作用
1.报错如下:2.解决方法:原创 2021-03-04 15:29:45 · 1589 阅读 · 1 评论 -
onready或者$()和onload的区别
1.onready或者$()比onload先执行2.onready或者$()是页面解析完成之后执行,而onload是在页面所有元素加载完成后执行3.onload只执行最后一个而onready或者$()可以执行多个一个是次数不同,$().ready()在一个一个html中可以使用多次,onload只能使用一次或者说有效绑定只能是唯一的一个。另一个是执行时机的不同,简单讲$()执行的时机要早于onload,因为$()只要在DOM树加载完成就执行,onload要在全部的元素加载完成执行。..原创 2021-03-02 17:14:49 · 1869 阅读 · 0 评论 -
Vue生命周期图示
下图展示了实例的生命周期。你不需要立马弄明白所有的东西,不过随着你的不断学习和使用,它的参考价值会越来越高。原创 2021-02-26 17:20:09 · 117 阅读 · 0 评论 -
使用cropper裁剪图片时缩小图片的大小
var cas = $('#tailoringImg').cropper('getCroppedCanvas');//获取被裁剪后的canvasvar base64url = cas.toDataURL('image/jpeg',0.1); //转换为base64地址形式,0.1代表将截取后的图片缩小对应的比例,png格式最大,jpeg最小原创 2021-02-26 10:05:27 · 1313 阅读 · 0 评论 -
修改头像样式,鼠标移动到头像时显示相机和修改头像,并且换行显示
在html页面引入font-awesome.min.css#userCenterPic1 span:hover::after { content: '\f030\A修改头像'; white-space: pre; position: absolute; left: 0; right: 0; top: 0; bottom: 0; color: #eee; background: rgba(0, 0, 0, 0.85); ...原创 2021-02-24 16:23:07 · 464 阅读 · 0 评论 -
a标签点击后阻止刷新当前页面
在html中,使用href属性返回空:<a href='javascript:void(0)'>禁止刷新当前页面</a>原创 2020-12-30 17:40:18 · 1748 阅读 · 0 评论 -
highcharts数据量相差太大不显示图例
如下所示:部件其实是有数据的,但是由于事件的数量过大,导致部件的数据没有显示出来,解决方法如下:plotOptions: { series:{ minPointLength:3 }}原创 2020-12-04 17:31:01 · 1037 阅读 · 0 评论 -
下拉框逐步加载数据
$(function () { $("#select").select2({ placeholder: "请输入案件编号 ", //文本框的提示信息 width: '205px', //文本框宽度 minimumInputLength: 0, //至少输入n个字符,才去加载数据 allowClear: true, //是否允许用户清除文本信息 ajax: { url: 'URL', //地址 ...原创 2020-12-03 15:41:08 · 222 阅读 · 0 评论 -
Html某一元素居于最顶层
此处以div为例。网页中有一个查询条件被挡住了,该查询条件是下拉框形式,放在div内,需要将其显示在最顶层。<div style="z-index:999"></div>z-index数值越大,显示的层级越高。原创 2020-10-12 13:58:48 · 14098 阅读 · 0 评论 -
echarts图片生成base64
将echarts生成base64时会调用echart.getDataURL();方法,但是只会看到一张背景,没有数据,这是因为在series里没有将添加如下设置:animation: false,//用于生成base64,不设置的话,会只有背景没有数据原创 2020-07-06 18:23:36 · 2061 阅读 · 0 评论 -
地图自定义信息窗口标题添加链接
效果如下:点击后,打开页面:<html><head> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> <script src="http://libs.baidu.com/jqu...原创 2019-04-28 11:04:05 · 366 阅读 · 0 评论 -
form序列化
$(“#form”).serialize(),会将表单里面的值全部序列化之后提交,控件属性必须包含name,例如:<input type="textbox" name="txtName" value="Json" />代码解析://**提交表单** form.on('submit(save)', function (data) {//点击提交 $...原创 2019-04-29 17:31:34 · 389 阅读 · 0 评论 -
layui框架Table的样式设置
layui.use(['table', 'common'], function () { var table = layui.table; var common = layui.common; var Columns = [ { field: 'Id', title: 'ID' } //该列一会隐藏掉 ...原创 2019-04-25 10:03:35 · 8803 阅读 · 1 评论 -
Highcharts设置柱形图表样式
function load_Cylindrical_chart() { var chart_xsys = Highcharts.chart('DivID', { //DivID即要放置图表的html元素的id chart: { type: 'column', backgroundColor: '#FCFFC5' //图表...原创 2019-04-25 10:54:19 · 1940 阅读 · 0 评论 -
Echarts实现百分比在饼图内部,说明在饼图外部
Echarts怎么实现下面这种效果:重点在下面代码中的series设置里面,使用两个重合的饼形图实现此种效果。饼形图的大小位置等都一样。唯一不同的就是label中的position属性(说明文字为“outer”,百分比为“inner”)labelLine中的show属性(说明文字为false,百分比为true)和显示文字(一个显示百分比,一个显示说明文字) var pieEch...原创 2019-07-01 15:06:32 · 11027 阅读 · 1 评论 -
Hichcharts让3D柱形图竖直显示
如下图所示:重点在这里options3d,alpha:内旋转角度 ,beta:外旋转角度,这两个的值要设置的比较小一点。让3D柱形图直立起来的关键参数是depth,图表的合计深度,默认为100,让depth的值变大一些,例如200,就可以让3D柱形图直立起来 var chart = new Highcharts.Chart({ chart...原创 2019-07-01 15:23:44 · 586 阅读 · 0 评论 -
使用Js传递URL参数时中文乱码解决办法
var data="要转到的页面";data = escape(data);if (lnk != null) { lnk.setAttribute("href", "hrefTo.aspx?&data=" + data); lnk.click();}在将参数进行传递之前,对其进行编码,如上图:data = esca...原创 2019-06-24 17:53:13 · 438 阅读 · 0 评论 -
Highcharts调整基础条形图的样式
初始样式:初始代码 :var chart = Highcharts.chart('level', { chart: { type: 'bar' }, title: { text: '楼宇等级' }, tooltip: { format...原创 2019-07-09 11:23:27 · 748 阅读 · 0 评论 -
Highcharts调整条形图样式
初始样式如下 ,在红色框内有一根线,当鼠标离开该图时线又消失:现在想让这条线永远消失,怎么办呢?xAxis: { crosshair: false,//将该参数设为false,即可使该条线永远消失。当为true时,将会出现该线 gridLineWidth: 0, lineWidth: 0, ...原创 2019-07-09 16:42:30 · 929 阅读 · 0 评论