ul点击li,增加样式
用户首次绑定后,需要选择一款头像

<!--imgList头像列表-->
<el-row class="regModel1">
<el-col :span="24" class="stepTwo">请选择一个形象作为您的头像吧!</el-col>
<el-col :span="24" class="zooSelect">
<ul class="zooIcon">
<li v-for="(item, index) in imgList" @click="selectIcon(item ,index)">
<div class="imgzoo fn-rel" :key="item.key">
<img :src="item.value" alt="">
<i class="el-icon-success fn-abs" :class="{'colorShow': index === cwtx}"></i>
<p>{{item.remark}}</p>
</div>
</li>
</ul>
</el-col>
<el-col :span="24" class="stepfinish"><button class="nextBtn" @click="finBtn">完成</button></el-col>
</el-row>
/*
*选择用户头像
*/
selectIcon(item,index) {
this.cwtx = index
this.selectKey = item.key
},
ul点击li,增加样式的更多相关文章
- 设置ul的指定li 样式
设置ul的最后li 的样式 .custom-consumerIndex .card-content .list-block ul li:last-child .item-inner { border- ...
- ul 、ol li 继承原有样式的问题
如: 1.为什么我的服务器无法远程了? 2.为什么我的服务器总是自动重启? 3.为什么我的服务器总是自动重启? 以前写这种类型的列表,都是自己用键盘输入这些数字,其实不然,ul .ol li本身就自带 ...
- 对Ul下的li标签执行点击事件——如何获取你所点击的标签
问题所来:做项目时,一般的数据都是用循环动态加载出来的,结构都是一样的,只是绑定的值不同,如何对相同的标签做处理的问题就来了. 例如:点谁就显示谁的数值 <ul > <li id=& ...
- easyUI在使用字符串拼接时样式不起作用,点击加号增加一行,点击减号删除一行效果。
拼接的按钮没有样式,需要使用 var str = $("<a href='javascript:void(0)' class='easyui-linkbutton' onclick=' ...
- jquery怎么在点击li标签之后添加一个在class,点击下一个li时删除上一个class?
思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...
- jquery如何实现点击LI标签和下面的LI互换顺序? 超简单代码
转: jquery如何实现点击LI标签和下面的LI互换顺序? 上面的效果涉及jquery的两个方法: next() : 获得匹配元素集合中每个元素紧邻的下一个同胞元素. after() :在被选元 ...
- jquery点击li标签之后在该li标签上添加一个class,点击下一个li时删除上一个li的class
思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class 具体演示如下: 1.HTM ...
- jq 鼠标点击跳转页面后 改变点击菜单的样式代码
点击菜单跳转页面,然而跳转后的页面字体并没有加粗用如下代码 <div class="bg01 menu"> <img class="img01" ...
- Vue实现点击li变色
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- 20190223 Hadoop生态圈,关于大数据
周六参加了一场,大数据基础培训,讲得比较详细.培训的讲师对于互联网行业职位萎缩也有相对的解释,也还介绍了新的职位的诞生. 以前对于大数据的理解,就是超大的数据量,但对大数据开发不甚了解. 大数据平台的 ...
- 使用python以及工具包进行简单的验证码识别
识别数字验证码 首先我们准备素材,4张验证码图片如下: 第一步: 打开图像. im = Image.open('temp1.jpg') 第二步: 把彩色图像转化为灰度图像.彩色图像转化为灰 ...
- GUI库之认识Tkinter(一)
一.介绍 Tkinter是Python默认的GUI库,我们经常使用的IDLE就是用Tkinter设计出来的,因此我们在使用的时候直接导入Tkinter模块就好了. 1.特点:可移植性.灵活性高 2.构 ...
- python实时得到鼠标的位置
1.#先下载pyautogui库,打开cmd输入pip install pyautogui,回车 2.代码如下: import os,time import pyautogui as pag try: ...
- HAProxy基础原理介绍
HAProxy的功能概述 反向代理 1. mode http,https: 七层反向代理(仅支持http,https七层协议) 2. mode tcp: (伪)四层反向代理 调度器 ...
- SQLite数据库管理工具(SQLiteStudio)v3.1.1
http://www.pc6.com/softview/SoftView_86552.html
- spring boot 的使用
一:首先安装spring boot插件 两种方式安装, 1:使用myeclipse自带的安装插件的功能 help> install from catalog> 将出现下面的界面,搜寻sp ...
- (转)Redis集群搭建与简单使用(最少需要 6个节点)
介绍安装环境与版本 用两台虚拟机模拟6个节点,一台机器3个节点,创建出3 master.3 salve 环境. redis 采用 redis-3.2.4 版本. 两台虚拟机都是 CentOS ,一台 ...
- keras实例学习-双向LSTM进行imdb情感分类
源码:https://github.com/keras-team/keras/blob/master/examples/imdb_bidirectional_lstm.py 及keras中文文档 1. ...
- 【Java】-NO.16.EBook.4.Java.1.001-【疯狂Java讲义第3版 李刚】- UML
1.0.0 Summary Tittle:[Java]-NO.16.EBook.4.Java.1.001-[疯狂Java讲义第3版 李刚]- Style:EBook Series:Java Since ...