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= ...
随机推荐
- apache airflow docker 运行简单试用
airflow 是一个编排.调度和监控workflow的平台,由Airbnb开源,现在在Apache Software Foundation 孵化. airflow 将workflow编排为tasks ...
- MSDN Windows XP Professional x64 Edition with SP2 +VL简体中文语言包+序列号
[资源名称]---Windows XP Professional x64 Edition with SP2 - VL (English)[资源类型]---ISO镜像[资源语言]---英语+简体中文[杀 ...
- URL中的hash(井号)
1.#的含义 #代表网页中的一个位置,其右边的字符,就是该位置的标识符.比如 http://www.example.com/index.html#print 就是代表index.html中的print ...
- 4G的添加
(ZTE 中兴 ME3760_V2 ) 1. 复制myLte文件到相关目录,设置权限为755 2.修改openwrt1407/package/base-files/files/etc/rc.local ...
- Openwrt 3g模块
支持Huawei E367 一.编译选项的选择 都选上 都选上 Network目录下 Utiles Luci 二.USB连接3G模块时,显示如下,表示成功 三.没找到:
- 【shell】awk命令
简介 awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑,awk在其对数据分析并生成报告时,显得尤为强大.简单来说awk就是把文件逐行的读入,以空格为默认分隔符将每行切片,切开的部分再 ...
- mysql编译安装(详细)
一.编译安装MySQL前的准备工作 安装编译源码所需的工具和库 yum install gcc gcc-c++ ncurses-devel perl 安装cmake,从http://www.cmake ...
- android studio 更新 Gradle错误解决方法(Gradle sync failed)
android studio 更新 Gradle错误解决方法 Android Studio每次更新版本都会更新Gradle这个插件,但由于长城的问题每次更新都是失败,又是停止在Refreshing ...
- 操作系统-容器-Docker:如何将应用打包成为 Docker 镜像?
ylbtech-操作系统-容器-Docker:如何将应用打包成为 Docker 镜像? 1.返回顶部 1. 虽然 DockerHub 提供了大量的镜像,但是由于企业环境的多样性,并不是每个应用都能在 ...
- 【Linux_Unix系统编程】Chapter9 进程凭证
chapter9 进程凭证 每个进程都有一套用数字表示的用户ID(UID)和组ID(GID).有时也将这些ID称子为进程凭证. 1:实际用户ID和实际组ID 2:有效用户ID和有效组ID 3:保存的s ...