想做一个就是点击一个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里面的文字的更多相关文章

  1. jquery点击添加样式,再点击取出样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. input radio点击选中再点击取消

    这里主要说一下这个jquery中的data()方法,个人感觉这个方法平时挺少用到的,所以说一说,按照官方的解释就是 向元素附加数据,然后取回该数据; 嗯,是的,就是这么简单. 那这里说一下这个方法的使 ...

  3. js计时器,点击开始计时,再点击停止

    点击倒计时开始,点击停止,再次点击又开始,再点停止... <i id=</i>秒 <em onclick="timeOpen();">开始</e ...

  4. Android:GridView中实现点击Item变色,再点击还原。

    使用GridView时想实现点击其中的一个Item,该Item改变背景,再次点击Item变回原来的背景,网上搜了很多资料都没有看到类似的案例,但还是有所启发,现来分享我的做法. 首先,首先为GridV ...

  5. js 点击图片放大,再点击缩小还原

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. vue 循环多个标签,点击标签变色,再点击取消,可以同时点击多个

    效果: <div class="relFacilityTitcon"> <i v-for="(item,index) in facilityList&q ...

  7. radio点击一下选中,再点击恢复未选状态

    radio点击一下选中,再点击恢复未选状态 实现方式1: <input   type="radio"   id="cat"   name="ca ...

  8. 常见问题1:默认div隐藏,点击按钮时出现,再点击时隐藏。

    例:默认div隐藏,点击按钮时出现,再点击时隐藏. <a href="#" onclick="f('ycbc')"; >控制按钮</a> ...

  9. 在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了?

    在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了? 在删除成功后,加上这句话就可以了:$("#dg").datagrid ...

随机推荐

  1. 怎样将多个CSS文件导入一个CSS文件中

    问题: 在HTML中引入css的其中的两个方法:    导入式和链接式的目的都是将一个独立的css文件引入一个文件中,二者的区别不大,事实上,二者最大的区别在于链接式使用html的标记引入外部css文 ...

  2. 注意HTML的语言编码charset

    注意HTML的语言编码的重要性 目录 charset编码重要性 charset在html什么地方 charset标签 编码种类 charset utf-8介绍 charset GB2312介绍 推荐网 ...

  3. 绘制 ToggleButton --重写view

    package com.example.compoundbuttonview.view; import com.example.compoundbuttonview.R; import android ...

  4. javascript语句——条件语句、循环语句和跳转语句

    × 目录 [1]条件语句 [2]循环语句 [3]跳转语句 前面的话 默认情况下,javascript解释器依照语句的编写顺序依次执行.而javascript中的很多语句可以改变语句的默认执行顺序.本文 ...

  5. 利用深搜和宽搜两种算法解决TreeView控件加载文件的问题。

    利用TreeView控件加载文件,必须遍历处所有的文件和文件夹. 深搜算法用到了递归. using System; using System.Collections.Generic; using Sy ...

  6. 对于placeholder浏览器兼容性(包括密码输入框)解决办法

    将以下脚本和样式引入你的页面(对于密码输入框,要设置ID属性值): <script type="text/javascript"> $(function () { // ...

  7. Elasticsearch 之 数据索引

    对于提供全文检索的工具来说,索引时一个关键的过程——只有通过索引操作,才能对数据进行分析存储.创建倒排索引,从而让使用者查询到相关的信息. 本篇就ES的数据索引操作相关的内容展开: 更多内容参考:El ...

  8. js基础篇——call/apply、arguments、undefined/null

    a.call和apply方法详解 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 ...

  9. js文件合并,压缩,缓存,延迟加载

    做web前段也有一段时间了,对于web中js文件的加载有些体会想跟大家一起分享一下. 1.首先说说js文件的合并和压缩吧 为了便于集中式管理js的合并和压缩我们创建一个Js.ashx文件来专门处理合并 ...

  10. C#控件绑定数据源方式

    1:控件数据源绑定泛型Dictionary<string,string> ): Dictionart<string,string> D=new Dictionary(strin ...