点击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 ...
随机推荐
- 关于OnEraseBkgnd和OnPaint的转载
问题是这样产生的.在OnEraseBkGnd中,如果你不调用原来缺省的OnEraseBkGnd只是重画背景则不会有闪烁.而在OnPaint里面, 由于它隐含的调用了OnEraseBkGnd,而你又没有 ...
- java中Comparable实现对象的比较
/* class A implements Comaprable<A>{ } 那么 A x = new A(); 类关系图 Object o = A; Object Comparable ...
- Supplemental Logging
Supplemental Logging分为两种:Database-Level Supplemental Logging和Table-Level Supplemental Logging,即数据库级别 ...
- Oracle Dataguard之物理standby的基本配置
尽管网上有很多Oracle Dataguard的配置教程,但不难发现,很多采用的是rman duplicate这种方法,尽管此种方法较为简便.但在某种程度上,却也误导了初学者,虽说也能配置成功,但只知 ...
- Android基于mAppWidget实现手绘地图(一)--简介
http://lemberg.github.io/mappwidget/user_guide.html 最近在看一些导游类应用,发现一些景区的导览图使用的完全是自定义地图,也就是手绘地图.这种小范围使 ...
- Mybatis学习错误之:重复加载mapper.xml
学习mybatis的时候,突然遇到测试出错.测试mapper代理失败,现在钻研少了,不喜欢看未知的错误了,立即改正.错误打印说mapper.xml已经注册,仔细查看SQLMapConfig.xml发现 ...
- oracle分页
sqlStmt = sqlCon.createStatement(); strSQL sql="select * from (select rownum rno,content from ( ...
- placeholder的兼容处理(jQuery下)
这是一个老问题,结合前辈们的经验,需要处理的问题有一下几个. 1.只有输入框(input/textarea)下的palaceholder属性存在的时候才需要处理这类兼容 2.处理好输入框上焦点和是焦点 ...
- fastcgi配置
fastcgi配置 我们这里说的fastcgi配置专指nginx对fastcgi的配置,fastcgi本身的配置介绍在fastcgi 安装文中有说明. nginx的fastcgi模块提供的命令 fas ...
- CSS魔法堂:Absolute Positioning就这个样
前言 当我们以position:absolute之名让元素脱离Normal flow的控制后,以为通过left和top属性值即可让元素得以无限的自由时,却发现还有各种神秘的力量左右着它的来去,于是我们 ...