要点:使用select();

上代码:

if (e.keyCode === 27){
document.getElementById('input').select()
}
//当点击键盘esc键时候,对input框进行全选。

修改样式:

document.getElementById('list').style = 'display: none;'

liDom[nowSelectTipIndex].style.backgroundColor='green'

innerHTML:

 //将生成内容添加到dom中
addContent = function (valueList) {
var ul = '';
for (item of valueList) {
ul += `<li>${item}</li>`
}
document.getElementById('list').innerHTML = ul;
}; //注意可以有html标签

28-30 js 文本全选的更多相关文章

  1. JS checkbox 全选 全不选

    /* JS checkbox 全选 全不选 Html中checkbox: <input type="checkbox" name="cbx" value= ...

  2. JS实现全选、反选、不选

    JS实现全选.反选.不选 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <meta charset=&quo ...

  3. 第十六篇 JS实现全选操作

    JS实现全选   嗨,同学们好,老师这里是专门教同学解决一些针对性的问题,所以说综合起来,就要靠同学自己了. 这节课我们学一个很实用的东西,全选操作!比如淘宝这种商城对吧,我的购物车,我要全选购买,或 ...

  4. elementUI+JS实现全选与反选

    在实际项目开发过程中,遇到的需求,需要实现全选以及取消全选等功能,主要使用ElementUI + JS来实现,具体代码如下: <!DOCTYPE html> <html lang=& ...

  5. 一个js编写全选、弹出对话框、ajax-json的案例

    js功能有:全选.弹出对话框.使用json传输ajax数据:不想在写多余的文字了,直接上代码: <%@ page language="java" contentType=&q ...

  6. jquery与js实现全选功能的区别---2017-05-12

    一.jquery常用的事件 click(),dbclick() focus(),blur() change() keydown(),keypress(),keyup() mousedown(),mou ...

  7. php处理表单中的复选框问题以及js实现全选

    做的一个项目中遇到了全选和取消全选的问题,这是一个很普遍的功能,,虽然我们经常用到,但是真正做起来却发现行不通,在网上找了些,大部分都是ie,但是谷歌内核浏览器不能正常实现,所以经过小小的调整,今天就 ...

  8. JS实现全选、不选、反选

    思路:1.获取元素.2.用for循环历遍数组,把checkbox的checked设置为true即实现全选,把checkbox的checked设置为false即实现不选.3.通过if判断,如果check ...

  9. JS实现全选功能

    000. 开始 学习JS有一段时间了,最近看了一些JS练手的小demo实例,自己也尝试着用JS进行实现. 全选功能是在很多注册页面.获取用户兴趣爱好.让用户勾选一些选项等页面中常见的一种效果,主要有全 ...

随机推荐

  1. 理解 Linux 的虚拟内存

    前言 前不久组内又有一次我比较期待的分享:”Linux 的虚拟内存”.是某天晚上加班时,我们讨论虚拟内存的概念时,leader 发现几位同事对虚拟内存认识不清后,特意给这位同学挑选的主题(笑). 我之 ...

  2. Mac 系统安装教程

    上周末买了一个二手的Mac,当时是抹掉整个硬盘的,所以只能选择重装系统了.但是,多次重装都是失败了.最后使用USB安装,试了好几次,误打误撞总算成功了. 下面是整个安装的教程: 1. 备份好所有的私人 ...

  3. 9.视差特效、回弹动画、overScrollBy

    视差特效 * 应用场景: 微信朋友圈, QQ空间, 微博个人展示,向下拉出,松开回弹* 功能实现: > 1. 重写overScrollBy > 2. 松手之后执行动画, 类型估值器 .  ...

  4. 每天学点SpringCloud(一):使用SpringBoot2.0.3整合SpringCloud

    最近开始学习SpringCloud,在此把我学习的过程记录起来,跟大家分享一下,一起学习.想学习SpringCloud的同学赶快上车吧. 本次学习使用得SpringBoot版本为2.0.3.RELEA ...

  5. phtoshop cs6 下载安装及破解方法(另附Photoshop CC 2018破解版图文教程)

    前言: 前端虽然用PS不多,但有时需要用PS切图:UI给你PSD图,需要取色,查看字体颜色大小:测量元素宽高等 但有时想找一个“麻雀虽小,五脏俱全”又是破解版的PS,也不是那么容易的 注:ps完整版不 ...

  6. 用CSS解决一个让人头疼的问题

    需求:下面的文字内容分别都写在一个a标签里,现在需要获取到每一行最后一个a标签的竖线,并删除  我首先想到的是用CSS3新增选择器—— :nth-child()来解决,比如 :nth-child(3n ...

  7. Go语言之Interface(二)

    使用指针接收器和值接收器实现接口 type Describer interface { Describe() } type Person struct { name string age int } ...

  8. [原创]K8飞刀Final

    法律声明: 工具仅供安全研究或授权渗透,非法用途后果自负. 工具: K8飞刀Final作者: K8哥哥博客: https://www.cnblogs.com/k8gege简介: 一款多功能网络安全渗透 ...

  9. node-sqlite3 学习笔记

    * 使用sqlite3持久化数据 * 需求:把一个数组中的每个对象,每个对象中的属性,存到xxx.db文件中去,像数据库一样的去操作它 * 功能:1. 创建数据库(数据库存在的话,那就直接打开) * ...

  10. Ocelot简易教程(五)之集成IdentityServer认证以及授权

    Ocelot简易教程目录 Ocelot简易教程(一)之Ocelot是什么 Ocelot简易教程(二)之快速开始1 Ocelot简易教程(二)之快速开始2 Ocelot简易教程(三)之主要特性及路由详解 ...