html
weitao_11
这个作者很懒,什么都没留下…
展开
-
lodash 防止抖,react hook 失效
需求:界面要做图片渲染,并且可以做翻页 实现完成之后进行压力测试,疯狂的翻页 gg。。图片渲染有快有慢,导致前面几张慢的把最后快的给覆盖了过程:使用 lodash debounce 防抖 失败了因为使用的是 react hook,他相当于每次都会创建一个新的 debounce 然后防抖就变成了延时 那既然是被新建了那就可以使用 ref 来操作,因为ref 是不会被注销掉的 const debounceRef = useRef(_.debounce(q => { .原创 2021-09-09 19:33:17 · 1250 阅读 · 0 评论 -
文本 diff 类似 git 显示
需求:两个文本进行比对差异 比对结果像git change 一样展示 自由限定文本间的差异进程:查找到相应的控件 diffdiff2html npm install diff npm install diff2html diff 可以对比两个文本, diff2html 可以将对比结果渲染成html import { createPatch } from "diff"; diff 还有其他的方法,diffWords, diffjson 等,不过返回的格式是一个正常...原创 2021-09-02 10:27:48 · 1367 阅读 · 0 评论 -
React Hook 遇到的问题集锦
part1:需求:发异步请求修改界面信息 请求结束后重新渲染界面问题:当你手速够快,或者请求返回速度够慢的时候,a 行先渲染,再渲染b 行的时候,a 行的结果会变回未修改时的结果过程:查看原先的代码 import React, { useState } from 'react';function Bulbs() { const [on, setOn] = useState(false); const switch = () => { console.原创 2021-09-01 14:43:12 · 185 阅读 · 0 评论 -
EditorConfig
需求:为了统一各个项目之前的规范,但是又不期望在每个项目之间都重新做一个配置流程:发现editorconfig可以很好的对代码做格式转化 查阅editorconfig配置root = true # 根目录的配置文件,编辑器会由当前目录向上查找,如果找到 `roor = true` 的文件,则不再查找[*] # 匹配所有的文件indent_style = space ...原创 2021-03-30 10:22:08 · 213 阅读 · 0 评论 -
js 实现截图粘贴进 input 实现图片上传
需求:有个地方需要上传图片,但是图片大多数需要截图,但是图片截图下来之后要先保存到桌面再进行上传太麻烦,需要将截好的图直接上传,略过保存都桌面过程:查看截图后的数据是怎么处理的,google发现截图后的数据都是存在剪贴板里的event.clipboardData : window.clipboardData将剪贴板里的图片信息拿出来let clipboardData = event.clipboardData ? event.clipboardData : window.clipbo..原创 2021-03-10 14:15:34 · 1389 阅读 · 0 评论 -
记一次z-index 失效
前提:react、antd过程:在现有的代码基础上做界面更新 写了一个组件使用position:absolute,显示的时候被下面的div遮挡,失败解决:在组件上加上了一个极大的 z-Index无效 查代码发现,父亲div里存在了position:relative position内部的zindex是会基于父亲的position的zindex生效的 修改所有父亲的zindex,控件的浮动居然被下面的antd的table给挡住了 f12 查...原创 2021-02-05 11:23:33 · 331 阅读 · 0 评论 -
记一次antd select 报错
前提:react做项目的时候使用了antd的select多选模式过程:在dev机器上开发完一切正常,然后放到测试服发现f12报错重现:1、无法在dev机器上重现,有的人使用能正常有的人就直接报错2、google错误原因,在select多选的时候默认值不能是 [''],可以是 '',可以是[]3、严格按照报错的人的步骤,重现了bug,能快速定位问题解决:select多选对应的value值在赋值之前做一个判定,如果存在空字符串,将空字符串移除回顾:1...原创 2020-10-30 15:46:47 · 778 阅读 · 0 评论 -
js 时间操作
Js获取当前日期时间及其它操作var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)myDate.getMonth(); //获取当前月份(0-11,0代表1月)myDate.getDate();转载 2016-03-03 14:18:32 · 267 阅读 · 0 评论 -
canvas 画图(有点想法版)
简介 HTML5 提供了强大的Canvas元素,使用Canvas并结合Javascript 可以实现一些非常强大的功能。本文就介绍一下基于HTML5 Canvas 的画图工具的实现。废话少说,先看成品: 该应用是遵循所见即所得(WYSIWYG, What you see is what you get)原则设计的,它具有以下功能:1. 可以绘制自由曲转载 2016-03-07 10:24:10 · 356 阅读 · 0 评论 -
ext js
EXT.getCmp("date").getValue()获得的值是一个很叼的东西Tue Dec 07 2010 00:00:00 GMT 0800 等等但他作为FROMPANEL 进行提交的时候传到后台的值却是(2015-12-12T00:00:00)但要作为get请求在后面添加的话要对其进行转码才能正常使用EXT.util.Format.date(end, "Y-M-D");原创 2016-02-19 16:52:29 · 251 阅读 · 0 评论 -
jquery 事件
在新建了东西之后要实现点击事件或者鼠标悬停事件什么的,就要用到 bind()这家伙了 $("button").bind({ click:function(){$("p").slideToggle();}, mouseover:function(){$("body").css("background-color","red");}, mouseout:fu原创 2015-09-09 15:50:26 · 480 阅读 · 0 评论 -
js file img 操作
function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('#thumbnail_view').attr('src', e.target.r原创 2016-05-18 13:37:26 · 1375 阅读 · 0 评论 -
css px 和 % ,em 等混合计算宽度或者高度
calc 计算width:calc(100% - 50px) 就能得到计算出来的宽度从而更好的进行布局。为了防止其他浏览器不兼容还要加上-webkit-calc(100% - 50px)-moz-calc(100% - 50px)原创 2016-06-23 10:14:57 · 641 阅读 · 0 评论 -
js JSON
var json = '{"result":true,"count":1}', obj = JSON.parse(json);编译出json 内容var json = JSON.stringify(new_tweets);将json转化成字符串原创 2016-11-22 14:01:50 · 203 阅读 · 0 评论 -
less 转css 实现有问题的笔记
less 转css1. calc 失败当直接用calc(100% - 100px) 的时候,gulp 会将less 转化成 0%, 和理想差距极大。正解:width: ~"calc(100% - 100px)" 即可。原创 2016-11-23 10:36:06 · 633 阅读 · 0 评论 -
h5 文件下载
链接下载a标签中的链接就是server 的地址即可js 实现动态生成function downloadFile(fileName, content){ var aLink = document.createElement('a'); var blob = new Blob([content]); var evt = document.createE原创 2017-03-22 10:01:33 · 721 阅读 · 0 评论 -
data URI scheme ie不支持
css 中添加*background-image: url(mhtml:http://www.zhangjingwei.com/demo/scheme/style.css!the9);就能使用data:image/png......原创 2017-03-22 10:21:03 · 389 阅读 · 0 评论 -
百度统计接口拦截
百度统计解析:https://blog.csdn.net/iqzq123/article/details/8877645ajax 拦截:http://www.jb51.net/article/91419.htm转载 2018-06-07 16:31:50 · 671 阅读 · 0 评论 -
js 和 php 判断 是否的微信和其他的网页
php 判断是不是 微信if (strpos($_SERVER['HTTP_USER_AGENT'], 'MicroMessenger') !== false) { $wx = WX_AUTHORIZE . "?appid=" . WX_APP_ID . "&redirect_uri=" . $urlencode . "&response_type=code&sco原创 2016-01-27 19:20:35 · 432 阅读 · 0 评论 -
marquee 轮播滚动吧span、img、div!!
marquee语法 实例一Hello, Worldmarquee常用到的两个事件:onMouseOut="this.start()" 当鼠标移出该区域时onMouseOver="this.stop()" 当鼠标移入该区域时实例二marquee常用到的两个事件下面开始说一下marquee所支持的属性behavior设定滚动的方式:原创 2015-12-09 16:45:40 · 393 阅读 · 0 评论 -
Ext 试用
checkboxselectionmodel 中 listeners:selectionchange。ext 往ajax的另一边传数据extraParams:{ a:"a", b:"b"}ext.XTemplate可以使用html 语句来实现一个模板然后用tpl for 循环来实现多个模板的输出。 function createItemsView(store) {原创 2016-01-21 16:08:38 · 454 阅读 · 0 评论 -
js调用php和php调用js的方法举例
1 JS方式调用PHP文件并取得php中的值 举一个简单的例子来说明:如在页面a.html中用下面这句调用: alert(jstext); 在b.php中有这样一段PHP代码: 当执行a.html文件时,就会调用b.php文件,并将b.php文件的输出作为JS语句来执行,所以转载 2015-07-28 11:07:59 · 356 阅读 · 0 评论 -
cookie 在php中的实现
cookie的实现cookie 和session不一样,session只要是传到服务器端,只要是这个网页端的都能使用,但cookie如果不设置属性的话只能在当前的路径下能够使用。cookie 有5个属性在使用时用 setcookie("name", value, time, path, domain)。在实现要在其他页面使用时需要对path进行操作,如果用“/” 来代替path则在全网原创 2015-07-29 14:27:28 · 274 阅读 · 0 评论 -
onmouse onkeypress and so on
一般事件 事件 浏览器支持 描述onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击onDblClick IE4|N4|O 鼠标双击事件onMouseDown IE4|N4|O 鼠标上的按钮被按下了onMouseUp IE4|N4|O 鼠标按下后,松开时激发的事件onMouseOver IE3|N2|O3 当鼠标移动到某对象转载 2015-07-20 10:09:12 · 347 阅读 · 0 评论 -
PHP导出excel
在实现excel的导出的时候,总是遇到这样或者那样的问题php 有自带的方式来导出excel 那就是定义一个php文件来echo出你想要输出的tableHeader( "Content-type:application/vnd.ms-excel ;charset=utf-8");Header( "Content-Disposition:attachment;filename=abno原创 2015-07-31 14:31:39 · 443 阅读 · 0 评论 -
Outline 边框
在html 的 text 文本中默认的会有一个 边框,他会在text 在聚焦的时候显示出来,就是outline, 就是轮廓轮廓有很多种如下,当是none 时就是 没有p.dotted {outline-style: dotted}p.dashed {outline-style: dashed}p.solid {outline-style: solid}p.double {out原创 2015-08-27 20:48:39 · 606 阅读 · 0 评论 -
createElement appendChild
js来实现div等东西的添加,之前为了能在js文件中就建立一个自制的 alert 于是学习了一下在实现生成要用到createElement 和 appendChild貌似还有其他的函数会用到但最基本的已经够用了, 使用的规则基本如下新建一个divvar alert_background = document.createElement("div");设置div的属性alert_ba原创 2015-08-27 21:15:10 · 468 阅读 · 0 评论 -
document.onmousemove
*{margin:0;padding:0;}div{width:100px;height:100px;font:bold 20px Arial;margin:50px;}#div1{background:red;position:absolute;left:0;top:0;}#div2{background:blue;margin-top:200px;overflow:hidden;}转载 2015-07-21 20:14:44 · 3904 阅读 · 0 评论 -
不支持ie浏览器处理页面设置
http-equiv="X-UA-Compatible"content="IE=edge">好吧前面加上这一句就赢了。。。。。原创 2015-08-05 10:01:04 · 633 阅读 · 0 评论 -
绝对定位还有相对定位,然后是优先级
id="reminder" style="background-color: rgba(0,0,0,0.5); position: fixed; width: 100%; height: 100%; display: none; top: 0; left: 0;"> style="background-color: rgba(255,255,255,1); position: fixed;原创 2015-08-05 10:34:43 · 1977 阅读 · 0 评论 -
ajax 从网页端发送数据到php端
ajax的使用需要在导入了 jquery之后才能使用,ajax在使用能将数据从网页端发送到sever端,在使用的时候就跟form表单差不多,但个人感觉要比form表单实用,基本上form能实现的ajax都能实现。ajax支持很多格式的传送,Jason, 还有数组 text 等,$.ajax({ url:"/php/ajax/checklogin.php", type:"原创 2015-07-29 14:49:41 · 656 阅读 · 0 评论 -
jquery 遍历
对于父节点的处理$("span").parents() 获取所有的span 的元素的祖先,$("span").parents(".test") 获取所有span 的元素的class是test 的祖先$("span").parentsUntil("div") 获得span 和 div 之间的祖先$("span"),parent() // 获得当前的span的父亲对子节点的处理原创 2015-09-08 10:42:39 · 368 阅读 · 0 评论 -
jquery 简单的动画效果
在html中默认的所有的元素都是不能动的 所以要实现动画效果,必须要将positon 设置为 fixed relative absolute 才能实现$(".ex .hide").click(function(){ $(this).parents(".ex").animate({ top:'-=150px', opacity:'0' }, "原创 2015-09-07 16:02:37 · 431 阅读 · 0 评论 -
jquery 设置内容和属性 元素添加和删除
设置文本样式$("#btn1").click(function(){ $("#test1").text("Hello world!");});$("#btn2").click(function(){ $("#test2").html("Hello world!");});$("#btn3").click(function(){ $("#test3").val("Dolly原创 2015-09-07 19:11:02 · 3920 阅读 · 0 评论 -
jquery 淡入淡出
速度可以用 slow fast 或者 毫秒代替$("button").click(function(){$("p").hide(1000, function);});hide后面还可以在加一个参数,是表示在隐藏后要执行的操作,如果没有要执行的操作就为空即可。在隐藏后的人也有显示东西基本一样就是hide变成了show。$("button").click(function原创 2015-09-07 15:25:04 · 575 阅读 · 0 评论 -
改变apache路径规则来实现隐藏真实路径
在apache中有实现路径的改变的功能首先要找到 httpd.conf 里面的下面会找到 LoadModule rewrite_module modules/mod_rewrite.so将最前面的# 去掉然后就能在最下面写新的路径规则了~如下RewriteEngine on RewriteRule ^/ajax/(.+)$ /kankan/php/ajax/$1.原创 2015-10-28 10:32:07 · 2261 阅读 · 0 评论 -
对button等东西加阴影
好吧其实也没什么大不了的。。。就是加一句css样式就好了-webkit-box-shadow: #000 0px 5px 10px;-moz-box-shadow: #000 0px 5px 10px;box-shadow: rgba(88,149,163,1) 0px 5px 10px;rgb当然就是颜色,第一个0px是表示阴影的左右移动距离,第二个5px是表示上下移动的距离原创 2015-12-10 13:58:13 · 383 阅读 · 0 评论 -
点击图片中的某个部分来跳转页面
map 之前不知道还有这么叼的东西, 这玩意要和 合起来一起用不然没啥软用。。。。貌似。。。首先在img 里面加一个attr 叫做 usemap 他要等于你要使用的map 的name,或者id(视浏览器的情况而定所以通常会将那个map的这两个属性设置成一样的)。这样就将map和img 关联起来了。然后在map 里面包围着 , 有几种属性 coords(坐标,表示的是相对当前原创 2015-12-19 13:46:05 · 7877 阅读 · 1 评论 -
js数组的操作
1、数组的创建1var arrayObj = new Array(); //创建一个数组2 3var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度4转载 2015-07-28 11:05:52 · 376 阅读 · 0 评论