![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
poetPg
知道的越多,学得越多。学的越多,做的越多。
展开
-
利用jquery ui中的slider编写自定义样式的滑动条
先来看下实现效果,经测试火狐,IE9+,谷歌浏览效果一致。因为实现借助于jquery ui,所以必须引入必要的文件,jquery.js,jquer ui.js和jquery ui.css。然后如上图,html结构<div class="scale_num_box"> <div>0</div> <div>...原创 2018-09-30 10:09:27 · 2156 阅读 · 0 评论 -
利用filter实现模糊查询
前端很多时候要实现模糊查询的效果,之前在网上搜模糊查询的时候,发现方法都比较麻烦,于是便写了这个比较简单的模糊查询。上面是简单的页面,要求列表内容根据输入框的值进行匹配。页面结构:<div class="search_box"><input type="text" placeholder="请输入您要查找的内容" autocomplete="off...原创 2018-08-13 09:56:52 · 6192 阅读 · 0 评论 -
移动端自定义的下拉插件
鉴于ios自带的select,使得select标签及相关插件都无法使用,自己便写了这个移动端下拉demo。自定义下拉遇到的一个小的难点是点击其他区域隐藏当前下拉,并且点击其他下拉时,当前下拉也隐藏。代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&...原创 2018-06-29 18:37:31 · 2167 阅读 · 0 评论 -
canvas实现点击,拖拽和缩放的效果
目标:实现红点的点击,拖拽,和缩放效果。思路:1.缩放通过scale,通过计算鼠标滚轮的滚动实现放大和缩小。2.拖拽和点击通过定时器区分点击和长按,长按拖拽,点击alert一句话。直接上代码: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...原创 2018-06-26 16:46:58 · 13740 阅读 · 0 评论 -
VUE elementUi导航写法
elementUi导航通常会和vue-router一起使用,所以与官网的示例的写法不太一样。具体写法如下 <el-menu :default-active="$route.path" class="el-menu-vertical-demo" router> <el-menu-item v-for="item in items" :index="item.src"...原创 2018-10-26 14:44:35 · 858 阅读 · 0 评论 -
echarts地图demo
echarts是一款常用的数据可视化工具,不过通常都是用来做折线图,饼图,柱状图之类的图表,很少用到地图,所以我对地图的api就比较陌生。下面是我练习写的一个demo。上图是江苏各个市区代理的学校数的统计地图。使用echarts必须引入jq和echarts,然后页面上放置一个显示地图的区域<div id="map" style="width: 500px;height: 5...原创 2019-07-23 13:51:55 · 1767 阅读 · 0 评论 -
输入框blur和提交按钮事件冲突处理
表单提交页面通常都需要做前端验证,有时不仅在提交按钮时需要验证一下表单内的内容,输入框失去焦点时也需要做验证处理。但是这样有一个bug,那就是人们可以输完后直接点击提交按钮,这样便会造成二次验证。问题就是上面的描述,处理方法也是从网上找到的,不过忘记出处了。处理的方法是利用timeout来解决,示例代码如下所示: /* 点击按钮时不触发input的blur事件 */ ...转载 2019-07-23 14:04:06 · 1371 阅读 · 0 评论