点击div全选中再点击取消全选div里面的文字
想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了
在网上百度了一下
然后网上的答案感觉很大的范围
然后一些搜索
然后就锁定了一个答案
就是那个页面我忘记在哪里了
上我在页面上写的代码吧
$('.modal-body').click(function(){
var text=this;
if (document.body.createTextRange) {
var range = document.body.createTextRange();
range.moveToElementText(text);
range.select();
} else if (window.getSelection) {
var selection = window.getSelection();
var range = document.createRange();
range.selectNodeContents(text);
selection.removeAllRanges();
selection.addRange(range);
} else {
alert("none");
}
})
就是这样了
网页上一开始是原生了
就是一个function里面放if else
然后我就在想怎么把这个放进jQuery里面去
然后我一开始是写了var text=$(this)
然后就开始报错
(index):281 Uncaught TypeError: Failed to execute 'selectNodeContents' on 'Range': parameter 1 is not of type 'Node'.(…)
就出来这个错误
然后就开始谷歌
为什么错误
然后就搜索到了可靠答案
就是来自stackoverflow
不得不说 这个网站太牛逼了
你只要搜索的正确 里面有很多答案 基本上我只要搜索一个问题然后页面上出来这个网站
我就觉得我的问题会得到解答
果然
然后这个网站告诉我的答案就是
var text=this而不是var text=$(this)
然后就完美解决了我的答案
然后也能执行了
网站上那个人是这样说的
因为if里面text是javascript对象
然后你要是$(this)的话就是一个jQuery对象,所以运行起来就会报错
厉害 佩服
后来我又发现了一个问题,那你一直是全选状态这样也不好吧
我看网上都是全选状态的时候就是再点击就可以取消全选
不是全选状态的时候再选择全选,这样的需求才是正确的嘛
所以上面那段代码已经不能满足我们了
所以再上代码
就是点击全选再点击取消全选
$('.modal-body').click(function(){
var text=this;
if(window.getSelection().toString().length>){
return false;
}else{
console.log();
if (document.body.createTextRange) {
var range = document.body.createTextRange();
range.moveToElementText(text);
range.select();
} else if (window.getSelection) {
var selection = window.getSelection();
var range = document.createRange();
range.selectNodeContents(text);
selection.removeAllRanges();
selection.addRange(range);
} else {
alert("none");
}
}
})
恩,这样差不多就符合我的需求了
点击div全选中再点击取消全选div里面的文字的更多相关文章
- jquery点击添加样式,再点击取出样式
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- input radio点击选中再点击取消
这里主要说一下这个jquery中的data()方法,个人感觉这个方法平时挺少用到的,所以说一说,按照官方的解释就是 向元素附加数据,然后取回该数据; 嗯,是的,就是这么简单. 那这里说一下这个方法的使 ...
- js计时器,点击开始计时,再点击停止
点击倒计时开始,点击停止,再次点击又开始,再点停止... <i id=</i>秒 <em onclick="timeOpen();">开始</e ...
- Android:GridView中实现点击Item变色,再点击还原。
使用GridView时想实现点击其中的一个Item,该Item改变背景,再次点击Item变回原来的背景,网上搜了很多资料都没有看到类似的案例,但还是有所启发,现来分享我的做法. 首先,首先为GridV ...
- js 点击图片放大,再点击缩小还原
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue 循环多个标签,点击标签变色,再点击取消,可以同时点击多个
效果: <div class="relFacilityTitcon"> <i v-for="(item,index) in facilityList&q ...
- radio点击一下选中,再点击恢复未选状态
radio点击一下选中,再点击恢复未选状态 实现方式1: <input type="radio" id="cat" name="ca ...
- 常见问题1:默认div隐藏,点击按钮时出现,再点击时隐藏。
例:默认div隐藏,点击按钮时出现,再点击时隐藏. <a href="#" onclick="f('ycbc')"; >控制按钮</a> ...
- 在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了?
在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了? 在删除成功后,加上这句话就可以了:$("#dg").datagrid ...
随机推荐
- jQuery学习易忘细节
1.类似于alert(""),但不会中断页面操作:console.log("last"); 2.javascript是HTML5以及所有现代浏览器中的默认脚本语 ...
- 分析优秀的.NET 文档设计工具Vsdocman 7.1 软件保护技术
Vsdocman是一个优秀的.NET源代码注释编写工具,方便的以GUI的方式设计.NET源代码的注释. 我们知道.NET源代码的注释是Xml格式的注释,在生成程序集时,只需用选中生成Xml注释,Vis ...
- ECMAScript 位运算符
位运算符是在数字底层(即表示数字的 32 个数位)进行操作的. 重温整数 ECMAScript 整数有两种类型,即有符号整数(允许用正数和负数)和无符号整数(只允许用正数).在 ECMAScript ...
- 给深度学习入门者的Python快速教程 - 番外篇之Python-OpenCV
这次博客园的排版彻底残了..高清版请移步: https://zhuanlan.zhihu.com/p/24425116 本篇是前面两篇教程: 给深度学习入门者的Python快速教程 - 基础篇 给深度 ...
- 天气webservices
Web现状 Web服务 概念 具有web服务 构成 UDDI WSDL 天气预报 web服务现状 记的以前看VB.NET时中间就介绍了WSDL,而今又学到web服务,所以用天气预报的实例学习一 ...
- CentOS7 PostgreSQL安装
CentOS7 PostgreSQL安装 CentOS7 PostgreSQL安装 Install 安装 使用yum安装 yum install http://yum.postgresql.org/9 ...
- oracle数据库字符集US7ASCII,在java中处理中文问题
原来项目中oracle数据库一直是US7ASCII,我新项目对接的时候,查询以及插入中文,出现乱码问题. 暂时未能解决此问题,最终决定每次转码: 查询的时候: List<Record> l ...
- 大话PHP缓存头
304的请求机制和200有什么不一样呢?在fiddler中查看304请求的时候突然想到这个问题,就想到研究下这个304请求机制了. 我们自己在nginx上放一个文件,test.png.可以使用下面的地 ...
- 前端自动化开发之grunt
上篇文章介绍了前端模块化开发工具seaJs,利用seaJs我们可以轻松实现前端的模块化编程,参见http://www.cnblogs.com/luozhihao/p/4818782.html 那么今天 ...
- js正则中的贪婪和非贪婪模式问题总结
var b="abeeee:eeeee:eeeeeab"; console.log(b.match(/e+\:e+/g));//["eeee:eeeee"]贪婪 ...