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= ...
随机推荐
- 横竖两个数字塔的效果BAT批处理怎么写?
横竖两个数字塔的效果BAT批处理怎么写?@echo offfor /l %%a in (0,1,1) do ( for /l %%i in (0,1,9) do ( for ...
- nyoj 探寻宝藏
探 寻 宝 藏 时间限制:1000 ms | 内存限制:65535 KB 难度:5 描述 传说HMH大沙漠中有一个M*N迷宫,里面藏有许多宝物.某天,Dr.Kong找到了迷宫的地图,他发现迷宫内处 ...
- 【转】每天一个linux命令(53):route命令
原文网址:http://www.cnblogs.com/peida/archive/2013/03/05/2943698.html Linux系统的route命令用于显示和操作IP路由表(show / ...
- 【转】每天一个linux命令(7):mv命令
原文网址:http://www.cnblogs.com/peida/archive/2012/10/27/2743022.html mv命令是move的缩写,可以用来移动文件或者将文件改名(move ...
- 前端可视化建模技术概览,包括:GoJS
我推荐使用的: 库 网址 备注 GoJS https://gojs.net/latest/samples/flowchart.html 推荐使用 相关文章: 前端可视化建模技术概览:http://le ...
- C#中如何把byte[]数组转换成其他类型
http://bbs.csdn.net/topics/20447859 byte[] bytes = new byte[256]; //receive some stream from network ...
- AppBox下调用HighCharts画曲线
例子见本博文件下载. 注意 xAxis: { categories: [<%= xAxisCategories %>], ...
- 如何用Photoshop画一个发光金币(unity游戏素材教程)
做好的发光金币预览图: 以下为如何用Photoshop画一个发光金币教程: [1]如上图1-2,新建,名称改为Coin,宽度20像素,高度20像素,分辨率72,背景白色: [2]使用Alt+Shift ...
- webpack 基本使用
1. 创建webpack-test文件夹 2. npm初始化 3. 安装webpack 4. 使用webpack打包 hello.js 是需要打包的文件 hello.bundle.js 是打包完以后 ...
- Ionic slides 轮播图
1. 创建界面 <ion-content> <ion-slides pager class="myslides"> <ion-slide> &l ...