【react 给选中的li添加样式（转载）】的更多相关文章

react 给选中的li添加样式（转载）

路:使用事件委托,关键:获取到的index必须转为数字,因为它是字符串 handleClick = (e) => { const nodeName = e.target.nodeName.toUpperCase() let tag = e.target; if (nodeName === 'LI') { let index = parseInt(tag.getAttribute('index')) this.setState({ currentIndex: index }) } } import…

判断一组checkbox/redio是否被选中,为其添加样式

业务场景:当一行中有一个CheckBox被选中,则为此行添加class. <script type="text/javascript"> $(function(){ $("input[type='radio']").click(function(){ $(this).parent("td").parent("tr").addClass("info"); }); $("input[typ…

同上！ 下拉复选框 点击当前的checkbox 选中后面li 添加到指定区域

(function() { $(".cxbtntj").click(function(){ console.log($("#jsLi1").attr("name")); $('.judge').find("input[type=checkbox]").each(function(index, ele){ if(ele.checked == true){ var judgel1 = $(this).attr("name…

天坑之路：用js给选中文字添加样式

前言 本例基于react,但是实际上就是用原生js做的.兼容性做到了IE9,但是按照这个思路做是可以做到IE8甚至更低的. 需求与最初的思路 当我拿到这个需求的时候以为很简单,就是可以给页面上的文章做记号,比如添加个下划线,或者背景涂色做成荧光笔的样子. 因为只需要兼容IE9,所以window.getSelection是支持的.(IE8及以下有其它的获取选中的方法) 那么思路就是选中文本,点击添加下划线后,通过 window.getSelection.getRangeAt(0) 拿到选中的文本对…

react动态添加样式：style和className

react开发过程中,经常会需要动态向元素内添加样式style或className,那么应该如何动态添加呢??? 一.react向元素内,动态添加style 例如:有一个DIV元素, 需要动态添加一个 display:block | none 样式, 那么: <div style={{display: (index===this.state.currentIndex) ? "block" : "none"}}>此标签是否隐藏</div>或者,…

React使用Styled-Componets来添加样式

React使用Styled-Componets来添加样式 Styled-Comonents是用JS中ES6 语法的方式来管理CSS样式的一个组件,解决了在import CSS文件时样式重复 安装 项目根目录下打开bash yarn add styled-components 新建一个style.js文件来添加样式 注意,这里不是用style.css文件. 使用 style.js /* * @Author: YooHoeh * @Date: 2018-07-17 16:23:09 * @Last…

Vue 循环为选中的li列表添加效果

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Vue 循环为选中的li列表添加效果</title></head><style> li{ list-style: none; } .active { background: rgba(135, 135, 135, 0.74); width: 20%; color: #eee;…

JQ添加移除css样式--转载 心存善念

我们常常要使用Javascript来改变页面元素的样式.其中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们通常是通过处理HTML Dom的classname特性来实现的:而jQuery里提供三种方法来实现这个功能,虽然它们和传统方法的思想相通,但是却节省了许多代码.还是那句话 - “jQuery让JavaScript代码变得简洁!” 1. addClass() - 添加CSS类 $("#target").addClass("newCla…

[转]用CSS给SVG <use>的内容添加样式

来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=referral --------------------------------------------------------------------------------------------------------------------- 一篇深入探究如何给SVG<use>元素的内容添加样…

JavaScript 应用开发 #5：为完成的任务添加样式

判断一下任务的状态,如果是完成的任务,可以在任务项目的上面,添加一个额外的 css 类,在这个 css 类里,可以去定义完成的任务的样式.比如,把文字的颜色变成浅友色,并且在文字上面添加一条删除线.这些样式,已经在应用的样式表里定义好了,放在了一个叫 .completed 的 css 类里面.下面,我们要做的就是把这个类添加到是完成的状态的任务项目上去. 要解决的问题 怎么样得到模型的属性的值. 怎么样为模型添加合适的 css 类. 怎么样在任务模型的完成状态发生变化时,立即更新任务项目的显示.…