js
huaweichenai
这个作者很懒,什么都没留下…
展开
-
js实现电子签名功能
电子签名原创 2022-07-11 11:11:38 · 1094 阅读 · 2 评论 -
将echarts生成的图表变为图片保存起来
一:echartsecharts官网:https://echarts.apache.org/zh/index.htmlecharts.js地址:https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js二:将echarts生成的图表变为图片示例1:html<div style="width:800px;height:500px;" id="chart"></div>2:生成echarts图表(js)原创 2021-11-03 17:26:40 · 3642 阅读 · 0 评论 -
使用flv.js实现flv格式的监控视频流播放
最近在对接海信的监控摄像头,对方返回的监控视频流格式是flv格式,我使用的是flv.js来实现监控播放一:flv.jsgithub地址:https://github.com/Bilibili/flv.jsflv.js下载地址:链接:https://pan.baidu.com/s/15yZ1IMKf1JQPtg4YRIic9w提取码:w4f3二:flv.js常用方法1:flvjs.isSupported():判断当前浏览器是否支持播放2:flvPlayer = flvjs.cr.原创 2021-10-30 11:03:28 · 5205 阅读 · 6 评论 -
实现video视频播放记录当前播放进度,下次播放时从上次播放进度开始播放
今天接到一个需求,要求用户播放视频时,退出后下次再次播放此视频时需要从上次播放的进度开始播放,这里我们使用到了video标签的currentTime属性(设置或返回音频/视频中的当前播放位置(以秒计))以及timeupdate方法(当目前的播放位置已更改时触发)例:1:html<videosrc="视频地址"controls="controls"autoplay="autoplay"width="92%"></video>2:jsvarmyvideo...原创 2021-01-27 15:33:49 · 7547 阅读 · 2 评论 -
js关于复制粘贴的一些相关操作
在一些网站中的信息是无法进行复制粘贴的,例如我们在注册一个用户时,密码框无法进行复制粘贴,那么是如何实现的呢?这里主要使用到了js的copy(复制)和paste(粘贴)两种方法1:copy(复制)<h1 id="nocopy"> 这段文本不运行复制</h1><script> nocopyHtml = document.getElementById('nocopy') nocopyHtml.oncopy = () => {原创 2020-12-21 13:42:43 · 634 阅读 · 0 评论 -
php+js实现文件分块上传
我们在上传大文件时,可能会由于服务器的原因导致文件上传失败,文件过大时由于服务器的配置或响应事件过长导致上传文件失败,这时候我们可以将一个大的文件分为若干块,然后分批次上传到服务端,当所有文件块上传完成后再由服务器将各个文件块整合成我们上传的文件一:分块上传流程:1:由前端js将上传的文件信息进行切割成若干块,然后循环将若干块的文件块上传到服务端2:服务端接收到文件块信息后保存起来,当所有文件块上传完毕后,将所有上传的文件块整合成文件并保存起来二:实现代码:1:HTML<in原创 2020-12-08 14:12:25 · 279 阅读 · 0 评论 -
使用lightbox插件实现图片预览功能
lightbox插件可以实现图片的预览功能lightbox插件的github地址:https://github.com/lokesh/lightbox2lightbox插件的简单使用一:引入linghtbox的js<script src="/js/jquery.min.js"></script><script src="/lightbox/lightbox.js"></script>二:引入linghtbox的css<lin原创 2020-07-02 16:04:46 · 1339 阅读 · 0 评论 -
使用icheck插件实现复选框、单选框控件美化
icheck插件github地址:https://github.com/fronteed/icheckicheck插件的简单使用1:引入css<link rel="stylesheet" href="/icheck/skins/all.css">2:引入js<!--引入jquery--><script src="/js/jquery.min.js"></script><!--引入icheck--><script.原创 2020-05-22 11:44:44 · 466 阅读 · 0 评论 -
使用jstree插件实现树形结构
jstree的github地址:https://github.com/vakata/jstreejstree的CDNJS地址的相关链接:(1):jshttps://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js(2):csshttps://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.cssjstree的简单使用1:引入c原创 2020-05-19 18:08:03 · 1018 阅读 · 0 评论 -
如何在微信小程序中嵌入html网页信息
最近公司有一个项目需要使用到拍照出现虚线引导框的功能,但是在html中只有安卓系统的微信单可以实现此功能,所有这时候我们发现微信小程序有自定义拍照的功能,这时候我们就想到将html网页信息嵌入到微信小程序中一:在微信小程序中嵌入html网页文档地址:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.htm...原创 2020-04-24 11:21:59 · 6881 阅读 · 0 评论 -
websocket 在客户端详细介绍
在前端(客户端)如何来连接服务端的websocket来实现通信呢,这里我就来介绍下在客户端websocket的实现一:创建一个websocket对象在客户端使用websocket首先需要创建一个wbsocket对象语法:webSocket=newWebSocket(url[,protocols]);参数说明:url:要连接的URL;这应该是WebSocket服务...原创 2020-01-10 15:16:57 · 1381 阅读 · 0 评论 -
使用select2插件实现select选择框的一些常用功能
在这之前对于select下拉框我使用bootstrap-select插件来处理select下拉选择框:https://www.wj0511.com/site/detail.html?id=224但是现在我们公司使用的是select2插件来处理select选择框,这里我就来简单的介绍下select2插件的简单使用一:下载select2select2的github地址:https://gi...原创 2020-01-06 14:11:39 · 1293 阅读 · 0 评论 -
使用html2canvas实现将html内容写入到canvas中生成图片
之前我们简单的了解了canvas的基本用法,这里我们来了解下如何将html内容写入到canvas中生成图片,这里我使用到了html2canvas插件,这个插件是基于canvas实现的html2canvas官网:http://html2canvas.hertzen.com/一:下载html2canvas插件1:直接下载html2canvas插件直接点击html2canvas.min....原创 2020-01-02 17:14:04 · 2402 阅读 · 0 评论 -
canvas 绘制图片
前面我们了解了canvas的一些基本使用方法,在canvas中我们还可以在canvas中直接绘制图片,在canvas中绘制图片主要使用到drawImage方法一:drawImage方法参数有三中情况1:三个参数ctx.drawImage(image,dx,dy)image:需要绘制的img图片dx,dy:绘制的img图片在canvas中的坐标(x,y)2:五个参数c...原创 2019-12-31 18:22:04 · 9222 阅读 · 0 评论 -
canvas的基本使用
canvas可以用来制作照片集或者制作检点的动画,甚至可以进行实时视频处理和渲染,这里我就来介绍canvas的简单用法一:canvas标签canvas标签和img标签看起来十分相似,canvas只有两个可选的属性width(宽度),height(高度)属性,没有src和alt相关属性,如果我们不给canvas标签何止width和heigth属性,则默认width为300px,height为...原创 2019-12-31 17:42:50 · 558 阅读 · 0 评论 -
百度编辑器上传图片时设置图片展示的最大宽度
我们公司制作常用的网站使用的是我们自己的cms,今天产品提了一个需求,希望在编辑器中上传图片时图片的最大宽度不要超过600px,在百度编辑器中上传图片有两种方式,单图上传和多图上传,而单图上传又分为点击按钮选择文件上传和拖拽文件到编辑区域上实现自动上传,这里我来分别实现在单图上传和多图上传上实现设置上传图片的最大宽度一:单图上传单图上传的实现分别为单击按钮选择文件上传和拖拽文件到编辑区域实...原创 2019-12-26 12:02:47 · 965 阅读 · 1 评论 -
js 实现DES加密解密
一:引入需要的cryptojs包<script src="https://cdn.bootcss.com/crypto-js/3.1.9-1/crypto-js.min.js"></script>2:DES加密解密方法如下//DES加密function encryptByDES(message, key){ var keyHex = CryptoJ...原创 2019-12-11 18:07:12 · 8145 阅读 · 1 评论 -
js 提示TypeError: e.indexOf is not a function解决
最近发现我们公司的底层框架使用的jquery版本过低,于是我在网上下载了最新的jquery3.4.1替换掉我们底层框架的jquery,替换掉之后发现,在登录底层后台后,发现iframe出现问题了,点击菜单后直接跳转到iframe内部页面,并且出现TypeError: e.indexOf is not a function的js报错解决方法:这是由于我们使用的$(window).load(f...原创 2019-12-11 12:00:30 · 9378 阅读 · 1 评论 -
js 获取url的get传参
js可以使用字符串函数实现获取url的get传参实现获取get传参的思路如下:1:获取当前url2:获取到?位置3:将?后面的字符串截取出来获取到get传参信息4:将截取出来的get传参信息进行处理获取到url的get参数具体实现如下://获取当前URLvar url = document.location.href;//声明一个对象var getRequest...原创 2019-11-13 16:32:48 · 2023 阅读 · 0 评论 -
js 实现二维码生成
我们可以使用qrcodejs来实现js生成二维码,qrcodejs是用于JavaScript的跨浏览器QRCode生成器,可以十分简单的实现二维码生成一:下载qrcodejs插件qrcode的地址:https://github.com/davidshimjs/qrcodejs下载下来的qrcode的文件如下,其中qrcode.js和qrcide.min.js就是我们所需要的js,qrc...原创 2019-10-17 11:55:35 · 3635 阅读 · 0 评论 -
微信JSSDK 实现打开摄像头拍照再将相片保存到服务器
在微信端打开手机摄像头拍照,将拍照图片保存到服务器上需要使用到微信的JSSDK接口,主要使用到了拍照或从手机相册中选图接口(chooseImage),上传图片接口(uploadImage)参考资料:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115https://www.easywechat.com...原创 2019-06-12 11:59:41 · 1421 阅读 · 0 评论 -
bootstrap-table实现表头固定以及列固定
之前使用bootstrap写了一个报表表格,最近突然找到我,说让我看看能不能将表格的表头和第一列进行固定,这样的话方便查看数据,于是,我开始了苦逼的研究起来,毕竟我是个后端啊,对于前端的样式问题,特别是小功能,烦的一批这里就记录下我的研究成果一:引入js和css<!-- 引入jquery --><script type="text/javascript" src=...原创 2019-03-06 17:44:55 · 34046 阅读 · 4 评论