工作总结
一些大大小小的经验
不能懒鸭
努力写出优雅的代码
展开
-
【textarea内容不反显】textarea标签内容不反显?因为`<textarea>` 不支持 `value` 属性。
var textContent="输入的具体内容..."//内容反显:let htmlStr = `<textarea name="textarea" rows="5" cols="30" minlength="10" maxlength="20">${textContent}</textarea>`//内容获取let newTextContent = $('textarea').val() 项目中实例:...原创 2021-11-19 14:22:32 · 590 阅读 · 0 评论 -
js文件上传(jquery、FileReader、Blob、FormData)
代码演示:只取文件名称、文件流两个字段传给后端,其他字段未演示文件名称:<input type="text" name="fileName" id="fileName"/><input type="file" name="fileUpload" id="fileUpload"/><button type="button" id="busiFile_submit">提交</button>var fileStream,fileName = ''/原创 2021-11-22 14:26:01 · 1845 阅读 · 1 评论 -
【js实现手写签名板】canvas
项目多个功能模块都用到签名,所以进行了封装,需要用到的签名的地方,只需要调用一下封好的signature函数,即可返回保存的签名照片(格式:base64,也可自行修改)<!-- 项目的html页面 --><div class="popverBox"> <div id="signSure" class="signSure"> <div class="topTitle">请写下您的名字</div>原创 2021-11-26 15:14:05 · 4794 阅读 · 17 评论 -
阻止移动端H5开发浏览器默认的左右滑动、下拉刷新行为
场景:移动端签名的时候document.body.addEventListener('touchmove',function (event) { event.preventDefault()},{passive:false})passive:false 告诉它这个监听器不是被动的监听器如果不加可能会报如下错误[Intervention] Unable to preventDafault inside passive event listener due to target being trea原创 2021-12-08 09:30:07 · 2151 阅读 · 1 评论 -
实现页面中元素的拖拽功能 Draggabilly
实现页面中元素的拖拽功能 Draggabilly代码以在jquery中使用为例,包管理工具、cdn引入等其他的形式的使用参考中文文档,中文文档地址:https://blog.csdn.net/auven_zj/article/details/74611887官方文档:https://draggabilly.desandro.com/获取源码打包文件draggabilly.pkgd.min.js 压缩版draggabilly.pkgd.js 未压缩版<script type="tex原创 2021-12-08 10:56:39 · 455 阅读 · 0 评论 -
webRtc 开启录屏、开启摄像头、回放、下载
web版的视频面试、在线会议等都支持分享屏幕、开启摄像头,这些都是在浏览器上实现的。浏览器上音视频通信相关的能力叫做WebRTC(real time communication),是随着网速越来越快、音视频越来越多,而被浏览器所实现的音视频的标准API。音视频通信的流程:采集、编码、通信、解码、渲染。实现功能:屏幕的录制、摄像头的录制、回放录制的内容,支持下载。采集:浏览器提供的两个api:(获取并播放)navigator.mediaDevices.getDisplayMedia :原创 2021-12-22 12:07:54 · 2423 阅读 · 0 评论 -
【pc端】获取前、后置摄像头名称及id,并实现切换
<!--摄像头下拉框--><select id="camera-all"></select><!--视频框--><video id="localVideo" playsinline autoplay muted></video>1. 获取前、后置摄像头并以下拉框的形式展示 var cameraAllDom = document.getElementById('camera-all') var cameraList.原创 2021-12-22 15:56:23 · 1487 阅读 · 0 评论 -
【ios video】ios使用video标签播放中遇到的问题
直接使用video标签,Android可以,ios不行,ios需要嵌套source标签一起使用,支持多种typeAndroid不给video加control属性,就不会显示播放控件(播放暂停按钮、调节声音等),但是ios不加control属性,也会默认显示播放按钮,使用css解决Android 给video标签加autoplay属性,视频加载完就会自动播放,但是ios默认禁止了视频的自动下载和播放,所以要load和play一下,才可以自动播放展示、关闭 视频播放窗口5.js中使用(展示.原创 2022-01-21 14:22:36 · 12291 阅读 · 3 评论 -
【js调用摄像头拍照】navigator.mediaDevices.getUserMedia、canvas
功能:拍照原理:点击 拍照的时候 截取视频的当前帧<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.原创 2022-02-07 17:07:40 · 1091 阅读 · 0 评论