web开发
文章平均质量分 59
Lucky_bo
你所知道的仅仅是一个人的名字,而非故事。
展开
-
echarts实现航线图,航运图
echarts实现航运图,航运图需求:地图上有一些地点或者港口,如果港口间有航线,则点击具体的点会显示出具体的航线。实现图如下:点击具体的点后呈现:具体的echarts代码如下:var data = [ {name: '上海', value: 50}, {name: '厦门', value: 50}, {name: '深圳', value: 6...原创 2019-10-30 17:31:52 · 13790 阅读 · 5 评论 -
safari浏览器中element UI table表格错位的兼容,合计行错位的处理
在使用固定table表头和合计行时出现了,表格错位的现象,具体解决方案:设置一个公共的样式:.el-table__header,.el-table__body,.el-table__footer{ width: 100%; table-layout: fixed !important;}因为表格是全局性的,这边最好设置一个全局的样式,合计的错位也相应的解决了。table-layout知识点补充:定义和用法tableLayout 属性用来显示表格单元格、行、列的算法规则原创 2020-12-17 17:16:31 · 2817 阅读 · 2 评论 -
iview表单rules验证有内容但是报了校验的错误
在vue项目入引入了iview,使用Form表单的rules校验设置的model和rules值都是对的 但是依然会报错校验代码如下:weight:[{ { required:true, message:"重量不能为空",trigger:'blur'}}]一开始很疑惑,因为对比了规则都是没问题的,但是最后发现rulesObj:{ weight:"", //string 类型}但是我们 v-model="rulesObj.weight " 传进来...原创 2020-09-01 15:43:52 · 2346 阅读 · 0 评论 -
angularJS控制器ng-controller里获取不到input标签里ng-model的值
所遇问题:<div class="list list-inset item item-input"> <i class="icon ion-ios-search placeholder-icon positive" ng-click="queryData(true,1)"></i> <input type="text" placeh...转载 2020-02-18 15:12:37 · 395 阅读 · 0 评论 -
获取dom元素的宽高
原生js获取dom元素的宽高var elementObj = document.getElementById("myElementId");var height = elementObj.offsetHeight // 获取得到该元素的高度var weight = elementObj.offsetWeight // 获取得到该元素的宽度jquery获取元素的高度$(".m...原创 2019-12-29 04:18:41 · 1284 阅读 · 0 评论 -
解决react中input框数据绑定的问题
在react框架中值是单向绑定的,导致input在使用this.state.xxx赋值的时候会显示值,但是在input中就不能输入值了,这个时候我们需要使用onChange方法,进行值的变更,具体实现如下:<Input value={this.state.selectTotal} onChange={(e) => this.getTotalPlanQty(e)} size=...原创 2019-12-04 11:40:40 · 2715 阅读 · 0 评论 -
angularJs - $filter过滤器使用和自定义过滤器
1.内置过滤器$filter 过滤器,是angularJs中用来处理数据以更好的方式展示给我用户。比如格式化日期,转换大小写等等。 过滤器即有内置过滤器也支持自定义过滤器。内置过滤器很多,可以百度。关键是如何使用: 1.在HTML中直接使用内置过滤器 2.在js代码中使用内置过滤器 3.自定义过滤器(1)常用内置过滤器 number 数字过滤转载 2018-01-11 11:37:31 · 664 阅读 · 0 评论 -
CSS3中的content和attr的用法
CSS3的出现使得样式表的功能变得越来越强大,而某种意义上也可以说它让我们开发起来越来越容易了。CSS3里虽然有很多重量级的新特征出现——例如transitions, animations, 和 transforms,但有一个特征虽然不是那么抢眼,但却是非常的有用,它就是content和attr表达式,它们能在你的页面下面悄悄的使用CSS来生成内容,下面让我们看看 attr 和 content 如原创 2018-01-11 14:02:47 · 1035 阅读 · 0 评论 -
angular4在typeScript中怎么调用过滤器处理时间格式
需求中要对时间格式化的处理,处理成类似20180323的类型,在过滤器中有定义和引入了时间格式转化的方法:import {Pipe, PipeTransform} from '@angular/core';@Pipe({ name: 'datex'})export class DatexPipe implements PipeTransform { transform(value: any,...原创 2018-03-23 11:29:18 · 1510 阅读 · 0 评论 -
css 文本超出2行就隐藏并且显示省略号,并解决在less中不生效的问题
首先,要知道css的三条属性。overflow:hidden; //超出的文本隐藏text-overflow:ellipsis; //溢出用省略号显示white-space:nowrap; //溢出不换行这三个是css的基础属性,需要记得。但是第三条属性,只能显示一行,不能用在这里,那么如何显示多行呢?css3解决了这个问题,解决方法如下:display:-webkit-box; //将对象作为弹...原创 2018-03-23 13:58:39 · 5176 阅读 · 0 评论 -
SourceTree的使用
1. SourceTree是什么拥有可视化界面的项目版本控制软件,适用于git项目管理window、mac可用2. 获取项目代码1. 点击克隆/新建 2. 在弹出框中输入项目地址,http或者ssh地址都可以 如果箭头指向的仓库类型表明“这不是一个标准的Git仓库”,可能是有以下原因 1) 项目地址获取错误 2) 没有项目访问权限3. 点击“克隆”,等待项目克隆完成,完成后,左侧只...原创 2018-06-08 10:45:36 · 698 阅读 · 0 评论 -
mac下查找端口是否占用及关闭占用端口进程
如何查找某个端口是否被占用:我们查找下 5000 端口当前被谁占用结果显示:可以看到node进程占用了 5000 端口.如何关闭此进程:ok,这样就结束了占用 5000 端口的进程....原创 2018-06-19 16:45:04 · 1659 阅读 · 0 评论 -
Typescript:遍历Array的方法,以及Array的常用方法
方法1:for循环for循环其实是标准的C风格语法。let someArray = [1, "string", false];for (var i = 0; i < someArray.length; i ++) { console.log(someArray[i]); // 1, "string", false}方法2:for…of这个貌似是最常用的方...原创 2018-07-20 18:04:32 · 12928 阅读 · 0 评论 -
js如何限制input输入框只能输入数字
代码中我是这样实现的:<input type="text" class="form-control match-rotation-input" maxlength="3" onkeyup="value=value.replace(/[^\d]/g,'')"//输入时校验 onblur="value=value.repl...原创 2018-08-20 15:01:31 · 36873 阅读 · 7 评论 -
html上传文件类型限制之accept的全部属性值
在上传文件的时候,需要限制指定的文件类型。 <input type="file" accept="image/*" /> accept表示可以上传文件类型,image表示图片,*表示所有支持的格式。accept可以指定如下信息:文件类型 accept属性值 类型 *.3gpp audio/3gpp, video/3gpp 3G...转载 2018-09-12 16:52:02 · 2868 阅读 · 0 评论 -
谷歌js断点调试
还没时间整理 先暂存参考地址https://blog.csdn.net/qq_41473887/article/details/81185572https://blog.csdn.net/crper/article/details/50722753原创 2019-05-27 16:48:28 · 515 阅读 · 0 评论 -
Electron主进程与渲染进程通信,webview与其加载页间的通信
1. 进程间通信进程间通信使用 ipcMain与ipcRenderer模块主进程:const ipcMain =require('electron').ipcMain;ipcMain.on('message',function(event, arg) {//监听渲染进程发送的messageconsole.log(arg);// prints "ping"...转载 2019-06-11 11:41:38 · 2628 阅读 · 2 评论 -
删除本地git项目中的tag
项目中,git所在的项目存放在D盘,名称为:gitAnalyzeWeb具体删除步骤看下图:成功的批量删除了tag: v2.1.0.0 v2.1.0 v2.1.0-RC0 三个本地tag原创 2017-12-05 10:10:02 · 2347 阅读 · 0 评论 -
关于echarts is not defined的问题
通过npm install echarts --save引入echarts后,也相应的引入了自定义的 NgxEchartsModule 然后进行使用echarts [options]="homepageOption" style="width:1120px;height: 400px;">结果报错:显示的错误是 echarts is not defined 的问题然后找原创 2017-10-23 16:30:21 · 15540 阅读 · 1 评论 -
angular 使用 ui-router 设计网页
这是个啥?ui-router是一个web客户端的路由解决方案。我觉得它最大的作用是将web界面的设计分块了。分块分层最初的web访问模型,是这样的: 我们访问page1,然后访问page2.... 在新的模型中它变成了这个样子: 访问效果是一样的,但是从设计上已经有了变化。它变成了:只有一张网页,在网页中有不同的区域,每个转载 2017-01-16 10:38:48 · 433 阅读 · 0 评论 -
css的选择器
什么是选择器? 每一条css样式声明(定义)由两部分组成,形式如下:选择器{ 样式; } 在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素。标签选择器标签选择器其实就是html代码中的标签。如右侧代码编辑器中的、、、、。例如下面代码:p{font-size:原创 2017-02-07 11:56:02 · 514 阅读 · 0 评论 -
js去除空格12种方法
JS去除空格的方法目前共有12种:实现1String.prototype.trim = function() { return this.replace(/^\s\s*/, '').replace(/\s\s*$/, '');}看起来不怎么样, 动用了两次正则替换,实际速度非常惊人,主要得益于浏览器的内部优化。一个著名的例子字符串拼接,直接相加比用Array做成的Stri转载 2017-01-12 16:56:10 · 5135 阅读 · 0 评论 -
AngularJS指令进阶 – ngModelController详解
AngularJS指令进阶 – ngModelController详解在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流。举个简单的例子,假如我们现在需要编写两个指令,在linking函数中有很多重合的方法,为了避免重复自己(著名的DRY原则),我们可以将这个重复的方法写在第三个指令的controller中,然后在另外两个需要的指令中r转载 2017-01-12 17:19:15 · 978 阅读 · 0 评论 -
AngularJS数组操作
1:ng-click,ng-model,ng-bind,ng-class,ng-hide,ng-app2:placeholder,3:{}中加入代码“:true|false”,使用逗号隔开,可以控制包括样式,显示与隐藏等功能,}1、数组的创建var arrayObj = new Array();//创建一个数组var arrayObj = new Array转载 2017-01-12 16:40:49 · 6692 阅读 · 0 评论 -
元素分类
元素分类在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有:、、...、、、、、、 、常用的内联元素有:、、、、、、、、、、常用的内联块状元素有:、元素分类--块级元素什么是块级元素转载 2017-02-10 17:08:08 · 412 阅读 · 0 评论 -
多个item的高度以最大的那个为准
首先遇到的需求是: 也就是替补球员的高度以最多的那队为主。由于每个item的高度都是自适应的,所以会导致替补球员少的那方高度比较低。于是我们想了一个方法,通过对比两支球队的人数来给少的那方的球队填充空的对象,让它只占位置不显示出来,效果就是看起来两个球队的高度一样了。angular.module('matchReports').service('player原创 2017-02-03 17:51:16 · 490 阅读 · 0 评论 -
vertical-align定义和用法
定义和用法vertical-align 属性设置元素的垂直对齐方式。说明该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。默认值:baseline继承性:no版本:CSS1原创 2017-02-24 15:28:42 · 893 阅读 · 0 评论 -
CSS3 渐变色彩
CSS3 Gradient 分为线性渐变(linear)和径向渐变(radial)。由于不同的渲染引擎实现渐变的语法不同,这里我们只针对线性渐变的 W3C 标准语法来分析其用法: 参数:第一个参数:指定渐变方向,可以用“角度”的关键词或“英文”来表示: 第一个参数省略时,默认为“180deg”,等同于“to bottom”。原创 2017-05-09 14:47:10 · 429 阅读 · 0 评论 -
css3 边框阴影 box-shadow
box-shadow是向盒子添加阴影。支持添加一个或者多个。很简单的一段代码,就实现了投影效果,酷毙了。我们来看下语法:box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];参数介绍: 注意:inset 可以写在参数的第一个或最后一个,其它位置是无效的。为元素设置外阴影:示例代码:.box_sha原创 2017-05-09 15:14:20 · 1305 阅读 · 0 评论 -
js中的Math对象的方法
1.丢弃小数部分,保留整数部分 parseInt(5/2)2.向上取整,有小数就整数部分加1 Math.ceil(5/2)3,四舍五入. Math.round(5/2)4,向下取整 Math.floor(5/2)5,返回数的绝对值 Math.abs(x)原创 2017-02-22 17:13:20 · 1603 阅读 · 0 评论 -
Typescript I: 遍历Array的方法:for, forEach, every等
Typescript的官方文档 Iterators and Geneators (https://www.typescriptlang.org/docs/handbook/iterators-and-generators.html)方法一,for…of 这个貌似是最常用的方法,angular 2中HTML语法绑定也是要的这种语法。let someArray = [1, "strin转载 2017-07-31 16:53:41 · 5002 阅读 · 1 评论 -
ngx-bootstrap中的datepicker实现本地化,国际化
在用Angular4框架开发中引入了ngx-bootstrap,使用了时间控件DATEPICKER,但是遇到的问题是它们显示的是英文字母,但我们想要的是中文字体如开发文档中显示的图如下:要实现本地化并不难,需要添加如下代码:文档介绍:You can do this with "moment.js", like this :date = moment(new Date()).原创 2017-08-10 16:17:35 · 4621 阅读 · 0 评论 -
切换tab按钮事件模块化
得到的需求是有个切换按钮,好几个模块都有这个切换功能,所以我们可以把它抽出来单独设置成一个模块。首先是HTML文件:class="switch-time"> {{title}} *ngIf="isPrompt" src="assets/images/ic_question_black.png" title="表示在查询时间范围内比赛总时间较长的球队">原创 2017-10-09 14:19:04 · 1055 阅读 · 0 评论 -
html5本地存储web storage
Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Storage官方建议为每个网站5MB。Web Storage又分为两种:sessionStoragelocalStorage从字面意思就可以很清楚的看出来,sess原创 2017-10-12 16:31:56 · 560 阅读 · 0 评论 -
web开发的笔记
web开发的笔记1.在CSS中设置这个属性可以使鼠标的箭头产生变化,由箭头变成提示选中的状态cursor: pointer;原创 2017-01-12 17:05:54 · 1022 阅读 · 0 评论 -
less的使用
less的用法1.注释:less的注释有两种 一种是: /* 会被编译的 */ 另一种是: //不会被编译的 会不会被编译是指这个注释的文字会不会显示在该less文件所对应的CSS文件上2.变量 @test_width:300px; .box{ width:@test_width; height:@test_原创 2017-02-06 13:58:17 · 600 阅读 · 0 评论