JS 实现复制、全选文本
先上效果,由于截图,高亮蓝色成了灰色 参考这位大佬的 https://www.cnblogs.com/dreambin/p/9046999.html
HTML 部分
<form name=test>
<input type="button" id="cardList" value="点此全选复制" onclick="javascript:selectAll('test.select1')"> <textarea name="select1" rows=3 cols=46 onclick="selectAll('test.select1')">可以全选</textarea>
</form>
javaScript 部分
//实现全选功能
function selectAll(theField) { var tempval = eval("document." + theField) //这里主要是要得到dom document.test.select1 tempval.select() // 选取文本域的内容 this.copy(tempval.value)
} //实现复制功能
/*
Evevt.clipboardData 对象 clipboardData是JavaScript剪切板对象,该对象提供了3个常用方法: clearData(): clipboardData对象从剪切板删除一种或多种数据格式(一个参数:数据类型) getData(): clipboardData对象从剪切板获取指定格式的数据(一个参数:数据类型) setData(): clipboardData对象赋予指定格式的数据(两个参数:数据类型,要赋予的值) *数据类型一般为“"text/plain" ”
*/
function copy(str) {
var save = function (e) {
e.clipboardData.setData('text/plain', str); //clipboardData对象
e.preventDefault(); //阻止默认行为
}
document.addEventListener('copy', save);
document.execCommand("copy"); //使文档处于可编辑状态,否则无效
} document.getElementById('cardList').addEventListener('click', function (ev) {
copy(ev.target.innerText)
}) selectAll('test.select1')
JS 实现复制、全选文本的更多相关文章
- 移动端html5页面长按实现高亮全选文本内容的兼容解决方式
近期须要给html5的WebAPP在页面上实现一个复制功能:用户点击长按文本会全选文字并弹出系统"复制"菜单.用户能够点击"复制"进行复制操作.然后粘贴到App ...
- js EasyUI前台 全选的实现
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAWcAAAEQCAIAAADj/SKjAAAgAElEQVR4nO1dz48ry1W+/5N3swaFEP ...
- 原生js的联动全选
开发应用中有很多工具可以使用,下面介绍一个原生js写的联动全选思路!!! <!DOCTYPE html> <html lang="en"> <head ...
- JS对checkbox全选和取消全选
需求:checkbox控制列表数据全选与取消全选择. 效果图: 1.html <body > <input type="button" name="in ...
- 原生JS实现购物车全选多选按钮功能
对于JS初学者来说,一个完整的购物车实现还是挺难的,逻辑功能挺多.写出完整功能,能提升不少JS基础,下面实现购物车全选多选按钮功能: 首先HTML及CSS部分: <style> table ...
- JS小案例--全选和全不选列表功能的实现
纯js代码实现列表全选和全不选的功能 <!DOCTYPE html> <html> <head lang="en"> <meta char ...
- js中的全选,不选,和反选按钮的设定
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery、js操作checkbox全选反选
全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...
- js解决checkbox全选和反选的问题
function SelectAll() { var checkboxs=document.getElementsByName("chk_list"); for (var i=0; ...
随机推荐
- Android Studio中的非项目文件及项目目录下的全局搜索
一.背景 项目开发中,AS(Android Studio)经常会用到通过关键字在项目空间下搜索对应结果.最经常用到的Find in Path.例如打开Find in Path后,可以选中Scope t ...
- eclipse jvm 参数配置
双击tomcat服务器---->打开启动配置--->VM 自变量
- Java如何执行操作系统的CMD命令行
在模拟cmd调用Python时遇到一些情况,这类问题可以归类为"超时,阻塞"等,问题原因: Process p=Runtime.getRuntime().exec(String[] ...
- 【git】【Idea】git刷新获取远程分支列表,可以在idea上看到最新的远程分支列表
[前提:本地项目是从GitLab或gitHub这些远程仓库上拉下来的 ,并且本地安装了git] ==================================================== ...
- Python中的@函数装饰器到底是什么?
在解释@函数装饰器之前,先说一下,类中的类方法和静态方法. 在Python中完全支持定义类方法.静态方法.这两种方法很相似,Python它们都使用类来调用(ps:用对象调用也可以). 区别在于:Pyt ...
- 通俗易懂的讲解一下Java的代理模式
一.基本概念 代理模式是对象的结构模式. 代理模式给某一个对象提供一个代理对象,并由代理对象控制对原对象的引用(接口的引用) 二.静态代理 静态代理是指,代理类在程序运行前就已经定义好,其与**目标类 ...
- android studio学习----添加项目库
Library Project(库项目) compile project(':library') 引用名称为 library 的 module .需要注意的是,被引用的 module 需要在 {@pr ...
- Django app安装,配置mysql,时区,模板,静态文件,媒体,admin
1.创建app python manage.py startapp 名字 Migrations 数据库同步目录,记录数据库同步的记录 init 包文件 Admin.py django自带的后台管理文件 ...
- Linux Firewalld 基础实例
本次是一个Firewalld的基础操作实例,利用Firewalld图形操作界面进行访问控制操作. 实验拓扑 需求分析 首先拓扑涉及到两个区域,这里使用work和public区域,分别做相应的规则. 1 ...
- AMD Ryzen一代、二代CPU一览表
Ryzen一代(14纳米).二代(12纳米)CPU一览表 http://img30.360buyimg.com/sku/jfs/t1/1134/23/12713/382299/5bd910f9E63b ...