web 复制功能和span光标
参考文章:https://www.cnblogs.com/tugenhua0707/p/7395966.html
https://blog.csdn.net/woshinia/article/details/18664903
document..execCommand(”Cut”,”false”,null);//剪贴选中的文字到剪贴板;
document..execCommand(”Copy”,”false”,null);//剪贴选中的文字到剪贴板;
document..execCommand(”Paste”,”false”,null);//剪贴选中的文字到剪贴板;
document..execCommand(”SelectAll”,”false”,null);//剪贴选中的文字到剪贴板;
不让页面被选择:-webkit-user-select:none;user-select:none;
首先复制的内容必须是选中的内容。因此:可采用textarea
textarea{
resize:none; //去掉小三角
border:none; //去掉边框
}
<button id="start">开始</button>
<textarea type="text" id="test" >全选全选est</textarea>
$("#start").click(function(){
$("#test").select();
document.execCommand("copy");
alert("已复制。。。");
});
对于Span元素可采用Range加Selection:
--注意断点跟踪会导致聚焦选择丢失。
var range = document.createRange();
var text = $('span')[0];
range.selectNode(text);
//range.cloneContents().textContent;
var select = document.getSelection();
select.addRange(range);
对于复制还可以使用clipboard.js
https://clipboardjs.com/
官网上和下载的内容中有demo,可以使用。非常简单好用,同样不能用parse。
web 复制功能和span光标的更多相关文章
- 在angular项目中使用web-component ----How to use Web Components with Angular
原文: https://medium.com/@jorgecasar/how-to-use-web-components-with-angular-41412f0bced8 ------------- ...
- 如何检测 Web 服务请求丢失问题
导读 『StabilityGuide』是阿里多位阿里技术工程师共同发起的稳定性领域的知识库开源项目,涵盖性能压测.故障演练.JVM.应用容器.服务框架.流量调度.监控.诊断等多个技术领域,以更结构化的 ...
- Android vs iOS vs Web
Android vs iOS vs Web UI view Android ViewGroup ImageView TextView iOS UIView ImageView TextView Web ...
- Bootstrap Metronic 学习记录(二)菜单栏
1.简介 1) .环境配置 2) .提取页面 2).动态生成菜单(无限级别树) 2.系统环境配置 项目需要程序数据支撑,这里选择MVC5.0+EF6.0[SQLSERVER](不对MVC架构和SQ ...
- junit4 javaee 5.0 jpa SSH 单元测试问题集锦
本篇文章基于已经实现了ssh集成的demo.项目.具体的ssh项目怎么配置,请参考本文最后 spring环境下的JUnit4测试 1,下载所需jar包: spring-test-3.2.0.RELEA ...
- 【转】 JAR、WAR、EAR的使用和区别
Jar.war.EAR.在文件结构上,三者并没有什么不同,它们都采用zip或jar档案文件压缩格式.但是它们的使用目的有所区别: Jar文件(扩展名为. Jar,Java Application Ar ...
- Unity3D脚本中文系列教程(十三)
http://dong2008hong.blog.163.com/blog/static/469688272014032334486/ Unity3D脚本中文系列教程(十二) ◆ function G ...
- 《asp.net mvc3 高级编程》第三章 视图
一.视图的作用 视图的职责是向用户提供界面.从ASP.NET MVC3开始,视图数据也可以通过ViewBag属性访问.例如:ViewBag.Message 就等于ViewData["Mess ...
- 【回顾整理】HTML+CSS个的两个实战项目
一:麦子商城首页制作 代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset= ...
随机推荐
- metabase docker-compose 运行说明
metabase 是一款比较产品化的一个数据分析工具,支持的数据源也比较多 以下为简单的docker-compose 运行文件,同时集成了mongo 以及graphql 引擎,方便数据 的api查询 ...
- nginx-opentracing 简单使用
nginx 的日常的应用开发中占比还是比较高的,opentracing 是一个分布式追踪标准 相应是开源实现也比较多.nginx-opentracing 是一个opentracing nginx 的插 ...
- javabean(实体类)转Map类型
javabean(实体类)转Map类型 从网上"風亦飞"的导出EXCEL的源代码提取出来的.认为非常好用.分享一下给大家,主要看beanToMap方法就OK了 /*以下是从poi导 ...
- 创建ASM实例及ASM数据库
--======================== -- 创建ASM实例及ASM数据库 --======================== 一.ASM相关概念 1.什么是ASM(Auto Stor ...
- JUC原子类之 原子操作数据类型
根据修改的数据类型,可以将JUC包中的原子操作类可以分为4类. 基本类型: AtomicInteger, AtomicLong, AtomicBoolean ; 数组类型: AtomicInteger ...
- yii2 笔记(1)
1.js文件加载顺序问题 在视图中引用js文件的时候,使用到jquery会报错,因为自定义的js文件在jquery之前被引入了. 由于jquery,bootstrap是在AppAsset中全局引入的, ...
- SQLServer2008开启远程连接
1.查看sqlserver brower协议是否启动 2.对象资源管理器 右键属性->选择-> 方面->服务器配置->Remoteaccess ->True 3.对象资源 ...
- thinkphp3.2用户登录ajax提交验证
html代码 <if condition="!isset($_SESSION['account'])"> <div class="load lf&quo ...
- 【linux】Linux软连接和硬链接
1.Linux链接概念 Linux链接分两种,一种被称为硬链接(Hard Link),另一种被称为符号链接(Symbolic Link).默认情况下,ln命令产生硬链接. [硬连接] 硬连接指通过索引 ...
- 【python】python GUI开发框架介绍
Python GUI开发的库不少.最常用的的也就几个. Tkinter -Tk是Python自带的GUI库, 上手简单, 做个简单界面基本够用了,但是不够美观,功能不全面. wxPython -开源免 ...