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 多选 点击文字选中的更多相关文章

  1. 点击文字选中radio

    <html><body><form action="" name="form1" method="post"& ...

  2. 点击文字选中checkbox

    <html> <head> <title>test</title> <meta http-equiv="content-Type&quo ...

  3. element-ui Cascader 级联选择器 点击label选中

    通过修改label的样式解决: 注意:el-cascader-panel 是直接挂载在body上的,所以需要全局设置 .el-cascader-panel .el-radio{ width: 100% ...

  4. 点击文字可以选中相应的checkbox

    <html><head><title>中国站长天空-网页特效-表单特效-点击文字选中的复选框</title><meta http-equiv=&q ...

  5. zTree -- jQuery 树插件实现点击文字展开子节点

    新版本的zTree是单击+号展开子项,点击文字选中该项,双击文字展开子项 项目用的是3.5版本的,如果要点击文字展开子项暂时没查到资料,自己琢磨了下 项目用的是jquery.ztree.core-3. ...

  6. ztree点击文字勾选checkbox,radio实现方法

    ztree的复选框checkbok,单选框radio是用背景图片来模拟的,所以点击文字即使用label括起checkbox,radio文字一起,点击文字也是无法勾选checkbox. 要想点击ztre ...

  7. Ztree _ 横向显示子节点、点击文字勾选、去除指定元素input的勾选状态

    前些天项目需要树结构表现数据,需求ztree就能满足所以直接使用ztree只是踩了些小坑... 1.ztree子节点横向显示(下图): 效果说明:第三级子节点按需求横向显示其他竖向显示,每行最多显示5 ...

  8. radio点击一下选中,再点击恢复未选状态

    radio点击一下选中,再点击恢复未选状态 实现方式1: <input   type="radio"   id="cat"   name="ca ...

  9. checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中

     checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...

随机推荐

  1. MindManager 2021 版新增了哪些功能

    MindManager Windows 21是一款强大的可视化工具和思维导图软件,在工作应用中有出色的表现.今天就带大家来看下这个新版本增加了哪些功能? 1.新增现代主题信息样式MindManager ...

  2. 用MathType怎么把分数打出来

    分数是生活中最常见的数,作为大学生学习高数概率论更是离不开分数.分数是指整体的一部分,或更一般地,任何数量相等的部分.分数是一个整数a和一个正整数b的不等于整数的比. 当在日常用语中说话时,分数描述了 ...

  3. yii2.0 实现城市联动效果

    <script type="text/javascript"> function getcitytext(){ citytext = ''; $(".city ...

  4. 一:robot framework环境安装

    1.安装robot framework: 打开cmd进入dos下,输入 pip install robotframework Microsoft Windows [版本 10.0.18362.267] ...

  5. otter搭建

    转载: https://blog.csdn.net/inthat/article/details/93595156 https://www.cnblogs.com/Inspire-Yi/p/80943 ...

  6. SpringBoot整合阿里短信服务

    导读 由于最近手头上需要做个Message Gateway,涉及到:邮件(点我直达).短信.公众号(点我直达)等推送功能,网上学习下,整理下来以备以后使用. 步骤 点我直达 登录短信服务控制台 点我直 ...

  7. redis面试问题(一)

    五大常用数据类型 redis与其他缓存的比较 rdb和aof 主从复制,读写分离,哨兵机制 -------------------------------- 1.为什么使用redis (一)性能 我们 ...

  8. JDK阅读之Enum

    JDK学习之Enum enum的使用 在没有enum之前如果想要定义一些常量,就会采用如下的方式 假设要定义四个常量表示不同的季节 public class SeasonWithoutEnum { p ...

  9. kali putty远程连接允许以root身份登录

    原文链接:https://blog.csdn.net/long_long_chuang/article/details/70227874 kali linux通过ssh+putty来实现远程登录(亲测 ...

  10. PyQt(Python+Qt)学习随笔:模式窗口的windowModality属性与modal属性

    windowModality属性 windowModality属性只对窗口对象有效,保存的是哪些类型的窗口被模式窗口阻塞. 模式窗口防止其他窗口中的部件获取输入.此属性的值控制对应窗口可见时阻塞哪些类 ...