element Cascader 多选 点击文字选中
html 部分
1 <el-form-item label="A部署位置" >
2 <el-cascader
3 v-model="itemType.appSysOptions"
4 :show-all-levels="false"
5 :options="cityOptions"
6 :props="{ multiple: true , expandTrigger: 'hover'}"
7 separator=","
8 size="small"
9 collapse-tags
10 style="width: 195px"
11 filterable
12 clearable >
13 </el-cascader>
14 </el-form-item>
css 部分
1 .el-cascader-panel .el-checkbox {
2 width: 100%;
3 height: 100%;
4 z-index: 10;
5 position: absolute;
6 }
7 .el-cascader-node__label{
8 margin-left: 10px;
9 }
10 /* 这个样式针对IE有用,不考虑IE的可以不用管*/
11 .el-cascader-panel .el-cascader-node__postfix {
12 top: 10px;
13 }
工作总结,转发请注明出处,谢谢。
element Cascader 多选 点击文字选中的更多相关文章
- 点击文字选中radio
<html><body><form action="" name="form1" method="post"& ...
- 点击文字选中checkbox
<html> <head> <title>test</title> <meta http-equiv="content-Type&quo ...
- element-ui Cascader 级联选择器 点击label选中
通过修改label的样式解决: 注意:el-cascader-panel 是直接挂载在body上的,所以需要全局设置 .el-cascader-panel .el-radio{ width: 100% ...
- 点击文字可以选中相应的checkbox
<html><head><title>中国站长天空-网页特效-表单特效-点击文字选中的复选框</title><meta http-equiv=&q ...
- zTree -- jQuery 树插件实现点击文字展开子节点
新版本的zTree是单击+号展开子项,点击文字选中该项,双击文字展开子项 项目用的是3.5版本的,如果要点击文字展开子项暂时没查到资料,自己琢磨了下 项目用的是jquery.ztree.core-3. ...
- ztree点击文字勾选checkbox,radio实现方法
ztree的复选框checkbok,单选框radio是用背景图片来模拟的,所以点击文字即使用label括起checkbox,radio文字一起,点击文字也是无法勾选checkbox. 要想点击ztre ...
- Ztree _ 横向显示子节点、点击文字勾选、去除指定元素input的勾选状态
前些天项目需要树结构表现数据,需求ztree就能满足所以直接使用ztree只是踩了些小坑... 1.ztree子节点横向显示(下图): 效果说明:第三级子节点按需求横向显示其他竖向显示,每行最多显示5 ...
- radio点击一下选中,再点击恢复未选状态
radio点击一下选中,再点击恢复未选状态 实现方式1: <input type="radio" id="cat" name="ca ...
- checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中
checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...
随机推荐
- sql bypass waf fuzz python
从freebuf copy过来的,先保存,有空再改 #encoding=utf-8 import requests url = "http://127.0.0.1/index.php?id= ...
- centos虚拟机配置网络
首先想用xshell链接虚拟机,发现没有联网, 首先打开Windows下的服务 将虚拟机的网络设置为net模式 centos的网卡默认是关闭的,需要手动打开,首先进入这个目录 用vim打开ifcfg- ...
- 新鲜出炉!面试90%会被问到的Java多线程面试题,史上最全系列!
前言 最近很多粉丝朋友私聊我说能不能给整理出一份多线程面试题出来,说自己在最近的面试中老是被问到这一块的问题被问的很烦躁,前一段时间比较忙没时间回私信,前两天看到私信我也是赶紧花了两天给大家整理出这一 ...
- win10一行代码搭建本地html项目
最近玩了下web项目,需要部署到本地查看效果. 一:准备 1.安装python或者安装node.js 2.html项目文件 二:python搭建 1.进入html文件的路径 2.通过python命令部 ...
- 【P2634】聪聪可可——点分治
(题面来自Luogu) 题目描述 聪聪和可可是兄弟俩,他们俩经常为了一些琐事打起来,例如家中只剩下最后一根冰棍而两人都想吃.两个人都想玩儿电脑(可是他们家只有一台电脑)--遇到这种问题,一般情况下石头 ...
- IDEA创建web工程,不用Archetype(超简单)
Idea不用Archetype创建Web项目 以新建模块为例. 新建Maven项目 不勾选[Create from artchetype],直接Next pom中添加一句话: <artifact ...
- Eclipse中get/set方法自动生成
代码中点击右键(快捷键Ctrl+Alt+S) ->Source ->Generate Getters and Setters... ->全选(或选择需要生成的字段/方法) 动图: 静 ...
- Linux服务器学习----tomcat 服务配置实验报告(一)
一.实验目的 1. 掌握 tomcat 服务的搭建 二.实验内容 1. 搭建一台缓存 tomcat 服务器 三.实验环境1. tomcat 服务器 centos7 对应主机 ip 为 10.10.64 ...
- LaTeX中的插图
插图代码及注释: 显示效果: 更多命令可以看相关文档,通过在命令行终端输入 texdoc graphicx 命令打开文档.
- js中定时器调用函数时为什么会有引号
之前在学习的时候并没有发现的细节,关于js中,定时器的问题 这里我们写两个延时器 setTimeout(func, 0); setTimeout("func()", 0);定时器中 ...