因为div设置为contenteitable可编辑的文本内容用 select()选择全部内容不生效,所以只能用下列方法:

先 creatTextRange或者 createRange

 <div contenteditable='true' id="selectable" onclick="selectText('selectable')">http://example.com/page.htm</div>

    <script type="text/javascript">
function selectText(containerid) {
if (document.selection) {
var range = document.body.createTextRange();
range.moveToElementText(document.getElementById(containerid));
range.select();
} else if (window.getSelection) {
var range = document.createRange();
range.selectNodeContents(document.getElementById(containerid));
window.getSelection().removeAllRanges();
window.getSelection().addRange(range);
}
}
</script>

通过js操作,将div设置为contenteditable的内容设为全选状态的更多相关文章

  1. html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。

    关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...

  2. 第4天:JS入门-给div设置宽高背景色

    今天学习了js入门课程,听的不多,做了个小练习,给div设置宽高.背景色.一点点都是进步.核心代码如下: <!DOCTYPE html><html lang="en&quo ...

  3. 用js做的表单的增,删,以及全选

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>创 ...

  4. JS禁用浏览器退格键、禁止右键、禁止全选、复制、粘贴

    一.禁用浏览器退格键 摘抄自:https://www.cnblogs.com/wanggd/p/3164536.html 我们在真实的项目开发中经常会使用JS 对键盘上的一些按键进行禁用,常见的比如说 ...

  5. js操作获取和设置cookie

    //创建cookie function setCookie(name, value, expires, path, domain, secure) { var cookieText = encodeU ...

  6. jquery1.11 操作checkbox:全选、取消全选、获取选择元素、获取取消选择元素(总结)

    jquery1.11.1版本完成对checkbox的操作 1. 使用属性prop设置选中状态 2.使用:checked和:not(:checked)获取选中的元素 源码: <!DOCTYPE h ...

  7. jquery checkbox的相关操作——全选、反选、获得所有选中的checkbox

    1.全选 $("#btn1").click(function(){ $("input[name='checkbox']").attr("checked ...

  8. 全选,全不选,反选的js实现

    全选练习       ** 使用复选框上面一个属性判断是否选中                   - checked属性                   - checked=true:选中    ...

  9. 全选或者单选checkbox的值动态添加到div

    图片.png <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> < ...

随机推荐

  1. 【算法】变邻域搜索算法(Variable Neighborhood Search,VNS)超详细一看就懂的解析

    更多精彩尽在微信公众号[程序猿声] 变邻域搜索算法(Variable Neighborhood Search,VNS)一看就懂的解析 00 目录 局部搜索再次科普 变邻域搜索 造轮子写代码 01 局部 ...

  2. java 标准日期格式

    public static void main(String[] argv) { // 使用默认时区和语言环境获得一个日历 Calendar cale = Calendar.getInstance() ...

  3. Ansible 模式

    一.Ansible 命令 1.Ansible 命令执行的方式有两种:Ad-Hoc.Ansible-playbooks,这两种方式没有本质的区别,Ad-Hoc用于临时执行命令:Ansible-playb ...

  4. Linux 如何通过某一台服务器调用执行多台远程服务器上的脚本,结果显示在本地?

    现在都流行自动化运维了,可能目前技术不够,很多自动化工具还不怎么会用,所以本次只是通过ssh来实现功能. 说明:自己写的一个简单脚本,只是实现了基础功能,还有待优化. 一共三台机器: master:1 ...

  5. cmake入门之内部构建

    https://www.cnblogs.com/coderfenghc/tag/cmake/ https://cmake.org/cmake/help/v3.16/guide/tutorial/ind ...

  6. 在从myql服务器上 取消主从关系和重新构建主从关系

    取消主从关系 mysql -uroot -p mysql>show slave status\G; 查看主库是否为之前的ip mysql>change master to master_h ...

  7. PHP使用MongoDB存储经纬度,查询距离

    https://blog.csdn.net/qq_40012295/article/details/84861466 https://docs.mongodb.com/manual/reference ...

  8. Ionic4.x 中的 UI 组件(UI Components) 侧边栏ion-menu组件以及底部tabs结合 侧边栏 ion-menu

    1.侧边栏 ion-menu 组件的基本使用 1.创建项目 ionic start myApp sidemenu 2.配置项目 属性 作用 可选值 side 配置侧边栏的位置 start end me ...

  9. osg fbx遍历模型节点名称

    ; k<sg->getNumChildren(); k++) { //转换编 std::string name = vcfbx1.w2m1(vcfbx1.m2w1(sg->getCh ...

  10. ES6深入浅出-1 新版变量声明:let 和 const-3.视频 相关面试题

    执行顺序问题 请问console.log输出的值是多少 输出的肯定是1 假如这里有一行未知的代码 会打印出几? 如果这段未知的代码是a=2.那么其实console输出的就是2 只关心代码,没有关心代码 ...