点击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 ...
随机推荐
- HTML5之废弃和更新的元素与属性
废弃的元素和属性 [1]标签替换 <acronym> 替代:<abbr> <applet> 替代:<embed> 或 <object> &l ...
- CSDN 论坛招聘区是不是有潜规则?在Cnblog招个人试试...
CSDN 论坛招聘区是不是有潜规则? 在招聘区发了两个招聘贴都被删掉了... 而且没有任何提示和原因,或者站内短信提示.... 虽然csdn现在很水...不过在那边之前待了几年还是有点感情的 想顺便内 ...
- Ext1.X的CheckboxSelectionModel默认全选之后不允许编辑的BUG解决方案
Ext1.X的CheckboxSelectionModel默认全选之后不允许编辑的BUG解决方案,ext 的CheckboxSelectionModel在后台默认选中之后,前台就不允许编辑的bug是存 ...
- 从css3书写顺序引出来的border-radius参数
本鱼表示偶已经不会取标题了... 当时写这篇文章主要是想探讨一下优雅降级和渐进增强的区别,按照正常的逻辑思维,不管是降级还是增强,应该对于效果是没什么区别的,因为后者会覆盖前者,但今天无意看到张鑫旭的 ...
- 你见过吗?9款超炫的复选框(Checkbox)效果
复选框(Checkbox)在各个浏览器中的效果不一致,因此很多 Web 开发人员会自己重新设计一套界面和使用体验都更佳的复选框功能.下面就给大家分享9款超炫的复选框(Checkbox)效果,纯 CSS ...
- Android系统目录介绍
src目录:完成对java代码的编写 assets目录: 资源目录 res目录: 图片,布局文件和字符串,菜单等文件 bin目录:输出文件夹 如生成的apk安装文件 project.propertie ...
- velocity的一些用法
velocity模板其实就是java不分语法的翻译,用到的属性还是java的方法,get,set,等 1.截取部分字段substring 原始字符串:$!ag.tagValue,也许很长,前端页面展示 ...
- 为什么是梯度下降?SGD
在机器学习算法中,为了优化损失函数loss function ,我们往往采用梯度下降算法来进行优化.举个例子: 线性SVM的得分函数和损失函数分别为: ...
- LINQ的First与FirstOrDefault方法和Last与LastOrDefault方法。
First与FirstOrDefault的方法,均是返回集合中的第一个元素,区别在于如果没有结果,前者(First)会有抛出异常,后者(FirstOrDefault)会返回默认值.Last与LastO ...
- Entity Framework 实体框架的形成之旅--几种数据库操作的代码介绍(9)
本篇主要对常规数据操作的处理和实体框架的处理代码进行对比,以便更容易学习理解实体框架里面,对各种数据库处理技巧,本篇介绍几种数据库操作的代码,包括写入中间表操作.联合中间表获取对象集合.递归操作.设置 ...