selection-area鼠标框选择文件

body{user-select:none;}.parent{width:100%;高度：100vh；背景色：爱丽丝蓝；显示：弹性；间隙：10px；填充：20px;}.child{宽度：50px;高度：50px；background-color:antiquewhite;}.child.active{box-shadow:002px1pxrgba(255,0,0,0.4);}.parent>>>.custom-area{background:rgba(52,152,219,0.1);border:1pxdotted#2980b9;}最近做了一个类似云盘的web文件管理应用，需要有鼠标框选择文件包下载功能，这里记录下前端实现过程。应用UI要求鼠标按下滑动时出现线框，提取选中文件的ID，然后上传到服务器打包下载。在普通的网页上，当你按下鼠标左键滑动时，线框是不会出现的。在这里我找到了一个有用的库选择区域。具体可以参考官方文档。下面是我写的一个小demo。body{user-select:none;}.parent{width:100%;高度：100vh；背景色：爱丽丝蓝；显示：弹性；间隙：10px；填充：20px;}.child{宽度：50px;高度：50px；background-color:antiquewhite;}.child.active{box-shadow:002px1pxrgba(255,0,0,0.4);}.parent>>>.custom-area{background:rgba(52,152,219,0.1);border:1pxdotted#2980b9;}在线播放地址