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. Metasploit 脚本Web传递(Web Delivery)

    Metasploit 脚本Web传递(Web Delivery)

  2. 总是说spring难学?来看完这些spring的注解及其解释,真香!

    前言 用过spring的人都知道,spring简单的通过注解就可以完成很多事情,但这些东西是如何实现的呢以及如何应用到我们自己的代码中?接下来,让我们一起开启注解的旅程. 1. @Controller ...

  3. 去年去阿里面试,被问到ArrayList和LinkedList,我是这样回答的!

    前言 在一开始基础面的时候,很多面试官可能会问List集合一些基础知识,比如: ArrayList默认大小是多少,是如何扩容的? ArrayList和LinkedList的底层数据结构是什么? Arr ...

  4. 怎么在Word上编辑数学公式?教你一招

    在日常工作中我们常常会用到word来编辑文字.但是有时候也免不了要输入一些公式,尤其是数学.物理还有化学方面等较复杂的公式.这时候用word来编辑的话会很麻烦,很难编辑出来,那该怎么办呢? 我们都知道 ...

  5. 教你调节Boom 3D的3D音效强度,让音乐更带感

    Boom 3D的专业3D环绕技术,让用户能全身心地沉浸在立体音效中.无论是聆听音乐,还是观赏电影,立体音效都能为人们带来更加真实的听觉感触. 那么,Boom 3D的3D环绕功能到底能给用户带来怎样的体 ...

  6. SQL server分页的四种方法(算很全面了)

      这篇博客讲的是SQL server的分页方法,用的SQL server 2012版本.下面都用pageIndex表示页数,pageSize表示一页包含的记录.并且下面涉及到具体例子的,设定查询第2 ...

  7. PHP 统计目录下文件数和文件大小

    1 /** 2 * 统计文件数和文件大小 3 */ 4 private function getFileCacheCount($pathName) 5 { 6 $data = [ 7 'num' =& ...

  8. Java蓝桥杯——递归练习题:走台阶(偶数版)

    递归练习题:走台阶(偶数版) 小明刚刚看完电影<第39级台阶>.离开电影院的时候,他数了数礼堂前的台阶数,恰好是39级! 站在台阶前,他突然又想着一个问题: 如果我每一步只能迈上1个或2个 ...

  9. FL Studio——电音编曲人的奠基石

    随着近年来摇滚.电音的发展,越来越多的人开始对电子音乐编曲感兴趣,而电音编曲的首要条件,就是需要一个好的DAW(数字音频工作站),常用的DAW有很多,例如Cubase.Nuendo.Pro Tools ...

  10. 从零开始了解多线程知识之开始篇目 -- jvm&volatile

    CPU多核缓存存储结构图 电脑存储结构概念 多CPU 一个现代计算机通常由两个或者多个CPU,如果要运行多个程序(进程)的话,假如只有 一个CPU的话,就意味着要经常进行进程上下文切换 因为单CPU即 ...