自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(35)
  • 收藏
  • 关注

原创 高德地图画渐变线

高德地图如何画渐变线,渐变polyline

2023-12-08 17:20:18 1134

原创 如何给元素设置半个像素的边框

在浏览器中能识别的最小像素为1px,如果需要设置半个像素的边框我们需要通过伪类来处理。以下代码中#div1为一个像素的边框,#div2为半个像素的边框<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>半像素的边框&amp

2019-02-11 14:44:04 684

原创 微信小程序按钮去边框(button去边框)

微信小程序中的button组件默认自带边框,而且我们常规的给button设置border: none;或者border: 0;并不能去掉边框。无论是内联样式还是外联样式表都不好使。这是因为微信小程序的button组件的边框并不在button上,而是在button::after上,所以我们需要给button::after去边框。.btn::after { border: non...

2018-11-02 10:59:48 4557 3

原创 Echarts图表在移动端和小程序中影响页面的滚动的解决办法

Echats图表在移动端显示后,当手指在图表区域内滑动,会影响页面的滚动。h5页面没有亲测,小程序页面,经排查,是因为触发了touchStart、touchMove和touchEnd方法。一、h5页面解决方法1.如果可以的话,移动端建议使用highCharts代替echarts,感觉highcharts更适合移动端。2.如果不需要与图表进行交互,而只是纯展示的时候,可以用一个透明的元素...

2018-11-01 18:39:34 14364 2

原创 微信小程序中使用Echarts(可异步请求数据)

在微信小程序中使用Echarts,主要分为以下几步:1.首先要下载ecomfe/echarts-for-weixin项目,下载后将ec-canvas文件夹复制到小程序项目中,假设放在根目录下utils文件夹中。2.在要实现echarts图的页面引入echarts.js文件,例如要在index页面中展现echarts图的话,就在index.js文件中引入。import * as ech...

2018-11-01 18:15:10 10647 5

原创 ES6——变量的解构赋值

解构赋值:从数组或对象中提取值为相同格式对应位置的变量赋值。下面这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。一、数组的解构赋值//ES5{ let a = 10; let b = 20; let c = 30; console.log(a); // 10 console.log(b); // 20 console.log(c)...

2018-09-21 15:24:07 267

原创 ES6——let和const的用法

一、let1.let命令, 用于声明变量,只在let命令所在的代码块内有效es5中的作用域有两种,全局作用域和函数作用域,es6中let为js新加入了块级作用域,这表示外层代码块不受内层代码块的影响。let命令只在当前块级作用域内有效。ES6 允许块级作用域的任意嵌套。允许在块级作用域之中声明函数,但是该函数只能在该块级作用域内有效。注:在es6的浏览器中,es6为了兼容老代码,有如下规...

2018-09-20 15:34:41 684

原创 webpack的安装和使用(一)

webpack是一个静态模块打包工具,用于打包静态资源,例如项目中使用了less,sass,和stylus等css预处理器,而浏览器无法识别和编译,就需要一个webpack,打包后,直接在html文件中引入打包后的.js文件即可。一、webpack的安装1.打开命令窗口,全局安装webpacknpm install webpack -gcnpm install webpack -g (淘宝镜像,...

2018-06-11 11:00:52 962

原创 jquery和vue分别对input输入框手机号码格式化(344)

需求是这样的,输入手机号码的时候要三位三位四位的格式我在网上找了几个方法都是有问题的,有的是输入可以实现,删除的时候不好用,有的是输入后删除到只留三位的位置时再接着输入就没有空格了,所以自己写了个函数,以后就用这个啦一、jqueryfunction fomatterTel(val, old) {//val: 当前input的值,old: input上次的值 var str ...

2018-06-06 19:20:35 6785 1

原创 纯css改变input的光标颜色,字体颜色不变(设置光标颜色与字体颜色不同)

使用input输入框时,默认光标颜色是和字体颜色相同的,只需css设置color属性就可以同时改变光标和字体颜色但有时的需求是光标和字体颜色不一样,网上的caret方法经测试chrome并不管用,所以,代码如下 改变input按钮的光标颜色,不改变字体颜色 #input1 {

2018-05-08 18:02:29 2681

原创 jquery监听div等元素的内容变化

方法一:change事件change事件,在元素的值发生改变时触发,适用于文本域、textarea、select 。 或调用change()方法时可以监听。所以,我们可以模拟change为非表单元素监听change()事件。 change事件 #container { min-height: 120px; border: 1px solid

2018-03-07 10:16:09 38759 2

原创 vue中各选项及钩子函数执行顺序

在vue中,实例选项和钩子函数和{{}}表达式都是不需要手动调用就可以直接执行的。vue的生命周期如下图:在页面首次加载执行顺序有如下:beforeCreate                //在实例初始化之后、创建之前执行created                         //实例创建后执行beforeMounted             //在挂载开始之前调用filters  ...

2018-02-27 11:40:01 23131 1

原创 js监听浏览器关闭事件(区分刷新和关闭,兼容IE9,10,11,Edge,Chrome和Firefox)

监听浏览器关闭事件(区分刷新和关闭,兼容IE9,10,11,Edge,Chrome和Firefox)

2017-12-20 16:02:12 44748 9

原创 java爬坑之路(一)——编译可以正常编译,运行时报unsupported major.minor version 52.0

写了一个很简单的helloworld,编译可以正常编译,运行时报unsupported major.minor version 52.0错误。 java代码如下: 用javac Hello.java命令编译时,是没有问题的,用java Hello运行时,怎么也运行不了 后来查看了一下jdk版本,java -version,为1.7 环境变量中是这样的 解决方法:安装了一下jdk

2017-12-14 11:09:03 742

原创 jquery实现导航吸顶效果

js实现导航吸顶效果,主要通过监听页面滚动事件和获取页面各参数实现,可参考我的博客《使用原生js获取页面信息》和jquery手册 html, body { width: 100%; margin: 0; padding: 0; } .cont

2017-12-06 16:00:33 5549

原创 全选功能的实现(兼容ie8,可以部分禁用)

注:1.参数两个,第一个参数为全选按钮的选择器,第二个参数为除全选按钮外的其他复选框的父元素的选择器,如果其父元素为table,选择器要写为 "table tbody"。2.可有部分按钮禁用(disabled),例如 全选

2017-12-06 15:25:18 1090

原创 使用attr()设置checked属性时,第二次不起作用

使用attr()设置复选框checked属性时,在jquery 1.8.3版本中没有问题,但是在jquery 1.10.2版本中,第一次可以使用,第二次不能使用。解决方法:使用prop属性代替attr属性一、Attr除 checked, selected, 或 disabled状态属性外,其余的属性均可用attr()设置和修改。$("img").attr("src"

2017-12-06 13:21:05 3244 2

原创 使用js模拟锚点功能的实现

使用js模拟锚点功能的实现 锚点 + js 第一个div 第二个div 第三个div 第四个div 我是第一个div

2017-12-06 10:57:55 6340

原创 头像上传前本地预览功能的实现(兼容ie8)

以下代码为头像的上传前预览功能的实现,UI可自行发挥。可用form表单提交文件,也可使用jquery.form.js插件实现。下面demo中使用的form提交。 $(function () { $("#up").uploadPreview(); }); jQuery.fn.extend

2017-11-03 15:25:59 1565

原创 兼容ie8的多文件上传

在HTML5中,表单元素有一个新的属性multiple,可实现多选功能。这样就可以实现多文件上传,但是此方法不兼容ie8等低版本浏览器。所以项目中我使用的是百度的WebUpload插件,此插件在ie中底层使用flash实现多文件上传。以下代码是简单的demo,具体使用方法可依据官方文档。 选择文件

2017-11-03 11:10:13 9346 4

原创 通过form的action属性提交表单并接收处理返回值的方法(页面不跳转)

通过form的action属性提交表单,这个很容易。但是,由于这种方式是同步提交,所以会导致页面跳转,且不好拿到返回值。一般都用ajax代替。 有些情况ajax是不能使用的,严格的说是不好使用的。例如文件上传功能。 <input type = "file">通过form的action属性提交表单,并接收处理返回值的方法如下: html: <iframe src="" frameborder=

2017-09-28 15:35:55 22851 1

原创 ie8兼容性问题(八) jquery——ajaxSubmit

jquery.form.js是jquery的一个插件。其中有一个方法是ajaxSubmit。用于form表单的提交。这个方法是这么用 $("#form").ajaxSubmit({     type: "POST",     url: "../../integralIndexController.do?savaFileSave",     success: function(data) {}

2017-09-27 10:13:31 8031 5

原创 ie8兼容性问题(七) js参数值中文情况下无法传到controller

项目中遇到这样一个问题,要实现一个下载功能,参数有两个,一个id,一个标题。其中标题是中文。js写法: var params = {   "id": "0001",   "title": "需求响应速率概述" } window.open("downloadFilesController.do?download&id=" + params.id + "&title=" + params.ti

2017-09-27 09:28:58 1418

原创 ie8兼容性问题(六) 遮罩层(absolute,fixed)

带遮罩层的弹框的实现(absolute和fixed同理,以下代码用fixed举例)<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> #container { position: fixed; top:0;

2017-09-20 10:44:05 3136 2

原创 ie8兼容性问题(五) event对象、e.target和e.preventDefault

event对象在chrome、firefox等浏览器中,event对象可从事件函数的参数中传入。ie8中须从window对象中获取$("#btn").click(function(e) { var event = e | window.event; })target$("#btn").click(function(e) { var event =

2017-09-19 18:05:36 10287

原创 ie8兼容性问题(四) new Date()

问题时这样的var now = new Date("2000-01-02"); var nowTime = now.getTime(); console.log(nowTime); //ie //NAN //Chrome //946771200000这段代码在chrome中可以正常输出毫秒数,而在ie8中则输出NAN。 这是因为ie8不支持”2000-01-01”这种

2017-09-19 17:26:57 1851

原创 ie8兼容性问题(三) 缓存问题

IE8缓存问题ie8不进方法直接走successurl不变化

2017-09-19 16:32:12 1848

原创 ie8兼容问题(二) select文字垂直居中问题

ie8兼容问题(二) select文字垂直居中问题使用padding使得select垂直居中

2017-09-18 10:39:07 2928

原创 ie8兼容问题(一) getElementsByClassName

ie8不兼容原生js的document.getElementsByClassName()方法。解决方法一:可以使用jquery的$(".class")代替,需要引入jquery.js文件,适用于使用jquery库的项目。注意:document.getElementsByClassName()方法获取的对象为DOM对象,需要使用DOM对象的API$(".class")方法获取

2017-09-18 09:15:50 953

原创 js判断对象是否为空对象的几种方法

1.将json对象转化为json字符串,再判断该字符串是否为"{}"var data = {};var b = (JSON.stringify(data) == "{}");alert(b);//true2.for in 循环判断var obj = {};var b = function() {for(var key in obj) {return fals

2017-08-18 09:04:51 234635 3

原创 表单提交的几种方式

一、Form和提交html代码:姓名:国籍:中国英国法国1.formaction : URLmethod : 表单提交方式,默认为get,可选值为get/postenctype : 规定在向服务器发送表单数据之前如何对其进行编码。(适用于 method="post" 的情况),可取值为application/x-www-form-

2017-08-14 15:31:34 18125 1

原创 项目兼容ie8技术要点

好久没有写博客了,因为最近公司项目要调ie8兼容,一直在忙这事,终于竣工了,跟大家分享下这老掉牙的浏览器是如何搞定的。。。欢迎大家指教项目是使用的jeecg框架,后台使用的java,前端页面使用了bootStrap,jquery,easyui框架,页面是jsp+less+js,还用到了好多html5的新标记以及CSS3的新属性以及媒体查询。由于当时做项目时没有考虑ie8,所以改的过程中遇到了好...

2017-07-17 21:03:59 11202 3

原创 自适应网页(响应式布局)+弹性布局

1.自适应网页1.声明viewport元标签注:width=device-width 让宽度为设备宽度   initial-scale=1    设置初始缩放比例   user-scalable=no   设置用户是否可以手动缩放2.使用流式布局   实现方案:float:left     display:inline-block;     弹性布局 displ

2017-06-11 19:19:50 13307

原创 异步加载JavaScript

异步加载JavaScript   默认情况下javaScript是同步加载的,同步加载js文件时会阻塞后续程序的执行,影响页面渲染效率。解决问题两个方法:方法一:将js文件在html页面最后引入,同步加载时会先渲染页面,最后执行js ... 方法二:采用异步加载js文件常见解决方法有四种:1.使用jQuery中的$(document).ready方法(必须

2017-06-11 19:12:44 288

原创 使用原生js获取页面信息

1.获取文档宽度/高度    console.log(document.body.scrollWidth);    console.log(document.body.scrollHeight);    console.log(document.documentElement.scrollWidth);    console.log(document.documentEle

2017-06-11 19:06:50 1210

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除