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= ...
随机推荐
- oracle 日期时间函数
ORACLE日期时间函数大全 TO_DATE格式(以时间:2007-11-02 13:45:25为例) Year: yy two digits 两位年 ...
- restheart 基本使用
restheart 是一个方便基于mongodb的restapi 开发框架 参考项目 https://github.com/rongfengliang/restheart-docker-compose ...
- 转oracle 学习 - 表空间
Oracle 数据库的表空间和 Oracle 数据库数据文件 关于 Oracle 数据库的表空间. 很多 Oracle 初学者弄不明白表空间的概念和意义,他们只知道给数据库建表的时候需要到表空间这个东 ...
- 使用OPRT库来实现局域网视频实时传输
转载,侵删 4.代码设计 目的:使用OPRT库来实现局域网视频实时传输 参考samle_venc.c进行ortp开发 4.1.程序流程如下 step1:定义变量,VPSS,VENC,零散变量 step ...
- vs2013下OpenGL环境的配置
1.下载glut库:https://files.cnblogs.com/files/laoxia/glutdlls37beta.zip 2.解压后,将glut.lib和glut32.lib两个文件拷贝 ...
- 洛谷1352没有上司的舞会——树型dp
题目:https://www.luogu.org/problemnew/show/P1352 #include<iostream> #include<cstdio> using ...
- 使用scrapy框架爬取自己的博文(3)
既然如此,何不再抓一抓网页的文字内容呢? 谷歌浏览器有个审查元素的功能,就是按树的结构查看html的组织形式,如图: 这样已经比较明显了,博客的正文内容主要在div 的class = cnblogs_ ...
- Java之 Hashtable
Hashtable是Java中键值对数据结构的实现.您可以使用“键”存储和检索“值”,它是存储值的标识符.显然“关键”应该是独一无二的. java.util.Hashtable扩展Dictionary ...
- js和jquery判断该元素中是否有指定class
<div class="test">test</div> var t = document.getElementsByClassName('test'); ...
- python处理excel(二):写
代码参考自zhoujie.函数接口可参考该blog. 基本的write函数接口很简单: 新建一个excel文件 file = xlwt.Workbook() (注意这里的Workbook首字母是大写) ...