按住CTRL多选,按住shift连选的实现
<tr class="address" v-for="(counts, index) in counts" :key="index" @click="trSelect(index)" :class="rowsSelect.indexOf(index) != -1 ? 'selectTr' : ''"></tr>
document.onkeydown = (e) => {
if (!this.keyCode) {
if (window.event) {
this.keyCode = event.keyCode;
} else if (e.which) {
this.keyCode = e.which;
}
}
};
document.onkeyup = () => {
if (this.keyCode) {
this.keyCode = undefined;
}
};
trSelect(index) {
switch (this.keyCode) {
case 17://ctrl
this.isCtrl = true;
if (this.rowsSelect.indexOf(index) != -1) {
this.rowsSelect.splice(index, 1);
} else {
this.rowsSelect.push(index);
}
this.startIndex = index;
break;
case 16://shift
if (!this.isCtrl && this.rowsSelect.length == 0) {
this.rowsSelect.push(index);
this.startIndex = index;
return;
}
let start, end;
if (this.startIndex < index) {
start = this. startIndex;
end = index;
} else {
start = index;
end = this.startIndex;
}
this.rowsSelect = [];
for (let k = start; k <= end; k++) {
this.rowsSelect.push(k);
}
this.isCtrl = false;
break;
default:
this.rowsSelect = [index];
this.isCtrl = false;
this.startIndex = index;
break;
}
}
按住CTRL多选,按住shift连选的实现的更多相关文章
- Element中Tree树结构组件中实现Ctrl和Shift多选
在Element中的树结构中, 实现多选功能,首先的是判断有没有按下键盘ctrl和shift按键.但是在Element中的tree组件的左键点击事件是没有提供$event鼠标属性判断的.所以就需要在函 ...
- (转)Eclipse中需要查看某个类的源码,直接按住Ctrl 然后点击想要查看的类或则方法
文章转自:http://blog.sina.com.cn/s/blog_52f623240102vpcr.html 在Eclipse中需要查看某个类的源码,直接按住Ctrl 然后点击想要查看的 ...
- wpf Listbox 实现按住ctrl键来取消选中
1. 首先继承一个listbox,来获得按住ctrl键时,点击的item public class ListBoxEx : ListBox { public BeatTemplateWave GetA ...
- [Selenium]如何通过Selenium实现Ctrl+click,即按住Ctrl的同时进行单击操作
[以下是不负责任的转载……] 在自动化测试的过程中,经常会出现这样的场景: 按住Ctrl的同时,进行单击操作,已达到多选的目的 Actions a = new Actions(driver); a.k ...
- element穿梭框el-transfer增加拖拽排序和shift多选checkbox功能
<template> <div class="demo"> <el-transfer v-model="value" filter ...
- 在DbGrid中,不按下Ctrl,单击鼠标如何实现多选?谢谢
解决方案 » 有了dbgrid1.options.dgmultiselect:=true;必须按下Ctrl键,才能实现多选, 修改源代码,把以下内容if Select and (ssShift i ...
- 鼠标上下滑动总是放大缩小页面,按住ctrl+0
鼠标上下滑动总是放大缩小页面,可能是ctrl键失灵了,幸好键盘有两个ctrl键,按住ctrl+0,页面就正常了,吓死宝宝了,~~~~(>_<)~~~~
- 按住ctrl键可以在新窗口打开图片
用firebug查看网页时,img标签(或background属性里面的url地址源)里面的图片源按住ctrl键可以弹出新窗口显示,并可右键另存为到本地目录
- Spring Tool Suite4(sts)复制粘贴卡顿(ctrl+v, ctrl+c)、按住ctrl也很卡
最近在看<Spring in Action, Fifth Edition>,下载了Spring Tool Suite4,在使用的过程中发现了一些问题: 只要在复制粘贴(ctrl+c, ct ...
- Delphi 关于DBGrid多选删除(shitf多选,ctrl多选)
////删除多选记录 procedure THistoryForm.DeleteButtonClick(Sender: TObject);var tempBookMark:TbookMark; i ...
随机推荐
- 顺手写一下HTTP协议
本文目录 一 什么是HTTP协议 二 Http的特点 三 Http报文 回到目录 一 什么是HTTP协议 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写 ...
- 【android】安卓手机连接电脑了,但是adb devices找不到设备及找到设备但无权限的问题
安卓手机连接电脑的时候,会遇到adb连接失败,adb devices为空,或者连接成功,但是显示unauthorized的情况.遇到这种情况,一般认为是手机驱动安装失败,会选择重新下载安装驱动,如果还 ...
- 【转载】JVM 学习——垃圾收集器与内存分配策略
本文主要是对<深入理解java虚拟机 第二版>第三章部分做的总结,文章中大部分内容都来自这章内容,也是博客 JVM 学习的第二部分. 简述 说到垃圾收集(Garbage Collectio ...
- BZOJ-2298|区间dp|线段树
problem a Description 一次考试共有n个人参加,第i个人说:"有ai个人分数比我高,bi个人分数比我低."问最少有几个人没有说真话(可能有相同的分数) Inpu ...
- Redis集群(单机多实例)
Redis介绍 Redis是一个分布式缓存数据库服务器,提供基于内存访问的缓存服务,并且无论是在单服务器还是服务器集群上都有着较为灵活方便的扩展能力. 单个的Redis实例是单进程单线程的,由 ...
- stress负载生成器使用简介
一.Stress工具原始网页: https://people.seas.harvard.edu/~apw/stress/ 二.Docker镜像的构建过程(dockerfile): progrium/s ...
- CDH 报错:under replicated blocks
1.刚安装好CDH5.16.1集群(2个节点)出现了under replicated blocks错误,如下图 2.原因是CDH默认文件备份3份,而我们只有2节点,所以解决方法如下: ①集群增加一个新 ...
- jenkins构建成功,但war包没有发布到tomcat下
如题,jenkins构建成功,在jenkins的workspace中有生成的war包,但没有发布到tomcat的webapps目录. 构建日志 找了很多原因发现应该还是项目相对路径不对导致的,我的wa ...
- Axure中继器的应用场景和结构组成
应用场景: 当点击回复的时候,页面会会跳出来头像.昵称.时间.评论的内容(详情:https://jingyan.baidu.com/article/77b8dc7fb478346174eab622.h ...
- 添加并删除Marker
var data=new Array(); // 定位.显示内容 function setLocation(x,y,name,time,speed,direction,GPSstatus,carsta ...