如图不区分选项与其他选项是互斥的关系,当选择了不区分时,其他选项就要去除,当有其他选项存在时,就不能有不区分

解决办法:定义change事件,若列表发生改变,首先判断点击的是否是不区分,若是,则将其他选项剪切掉,若是点击的是其他选项,就判断已选择的选项中是否有不区分,若有,则将其切除

源码:

下拉列表框中定义事件:@change="handleSelectedChange"   //注:@=v-on
handleSelectedChange:function(value){
      if(value[value.length-1]=="不区分"){//如果点击的是不区分的选项,就将其他选项去除
        value.splice(0,value.length-1);
      }else if(value.indexOf("不区分")!=-1){//点击的是其他选项,若是内部含有不区分的选项,就将不区分的选项去除,注意这里的indexOf的O是大写的,真是烦人
        value.splice(value.indexOf("不区分"),1);//注意这里的indexOf的O是大写的,真是烦人
      }
    },

js解决下拉列表框互斥选项的问题的更多相关文章

  1. HTML5 respond.js 解决IE6~8的响应式布局问题

    HTML5 respond.js 解决IE6~8的响应式布局问题   响 应式布局,理想状态是,对PC/移动各种终端进行响应.媒体查询的支持程度是IE9+以及其他现代的浏览器,但是IE8在市场当中仍然 ...

  2. javaScript动态给下拉列表框添加选项

    方式一: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></titl ...

  3. 点击显示子菜单,离开隐藏子菜单(onmouseout下包含a标签的js解决方法)

    <div class="menu">     <a href="javascript:void(0);" id="a_all&quo ...

  4. JS解决通过按钮切换图片的问题

    我是JS初学者,本想通过JS解决轮播图的特效,上网看了下:大部分都是JQ解决的,对于初学者的我来说理解上有点困难.于是我自己只做了一个不那么高大上的JS轮播图,下面我简单介绍下我的步骤:在HTML中创 ...

  5. 去掉iframe默认滚动条后影响正常滚动以及js解决高度自适应。

    对于iframe,相信大家都是知道存在很多弊端,比如说不利于搜索引擎的抓取:产生冗余结构体系不易管理等.不过在漫长的开发路上有时候使用是不可避免的. 前两天在做一个退弹的功能的时候使用了iframe, ...

  6. 2.26 js解决click失效问题

    2.26 js解决click失效问题 前言有时候元素明明已经找到了,运行也没报错,点击后页面没任何反应.这种问题遇到了,是比较头疼的,因为没任何报错,只是click事件失效了.本篇用2种方法解决这种诡 ...

  7. js解决弹窗问题实现班级跳转DIV示例

    js解决弹窗问题实现班级跳转DIV 1.js代码如下: <%--实现班级跳转DIV--%>  <div id="displayClassDiv" style=&q ...

  8. Vue.js组件的重要选项

    Vue.js组件的重要选项 实例化Vue对象一些很重要的选项,Vue的所有数据都是放在data里面的,Vue的参数是个对象,对象里面的字段叫做data,data里面也是对象,data也可以写作是thi ...

  9. js进阶 9-11 select选项框如何动态添加和删除元素

    js进阶 9-11 select选项框如何动态添加和删除元素 一.总结 一句话总结: 二.js进阶 9-11 select选项框如何动态添加和删除元素 1.案例说明 2.相关知识 Select 下拉列 ...

随机推荐

  1. ID 生成器 雪花算法

    https://blog.csdn.net/wangming520liwei/article/details/80843248 ID 生成器 雪花算法 2018年06月28日 14:58:43 wan ...

  2. java安装与配置

    参考:https://blog.csdn.net/gaokao2011/article/details/75211429 Win 1.JDK JDK 可以到官网下载http://www.oracle. ...

  3. 20164310Exp6 信息搜索和漏洞扫描

    实践内容 (1)各种搜索技巧的应用 (2)DNS IP注册信息的查询 (3)基本的扫描技术:主机发现.端口扫描.OS及服务版本探测.具体服务的查点(以自己主机为目标) (4)漏洞扫描:会扫,会看报告, ...

  4. E3Upload项目总结

    项目需求:读取阿里云数据库数据,通过webservice接口上传给第三方. 概要设计,项目满足以下几点: 1.动态接口调用 2.给多平台上传 3.数据保持(减轻数据库压力) 4.上传任务管理 5.扩展 ...

  5. rediscluster安装

    Redis 3.2.1集群搭建   一.概述 Redis3.0版本之后支持Cluster. 1.1.redis cluster的现状 目前redis支持的cluster特性: 1):节点自动发现 2) ...

  6. FuzzScanner 信息收集小工具

    前言: 该工具集成了各种大牛的工具,比如子域名发现,目录扫描,nmap端口扫描,c段地址查询,端口指纹,以及waf查询 00X1: 安装不推荐git安装,首先直接githup脱下来:git clone ...

  7. eclipse修改android项目的apk包名类名

    在Google提供的Eclipse集成开发环境adt-bundle下修改名称的总结: 1.      修改工程名(apk名称) 在弹出的对话框中输入新名称 该操作实际上是修改<project&g ...

  8. Vue ElementUI 按需引入

    一.element UI组件的单独使用(第一种方法): 1.cnpm install babel-plugin-component -D         2.找到.babelrc 配置文件       ...

  9. 使用JavaMail创建邮件和发送邮件

    参考https://www.cnblogs.com/xdp-gacl/p/4216311.html,写的真好,知识在于分享,备份留着看 一.RFC882文档简单说明 RFC882文档规定了如何编写一封 ...

  10. Android 开发 倒计时功能 转载

    原文地址:https://www.cnblogs.com/xch-yang/p/7920419.html Android为我们封装好了一个抽象类CountDownTimer,可以实现计时器功能: /* ...