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

解决办法:定义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. HTML5 video 播放视频黑屏

    <video width="320" height="240" controls>        <source src="movi ...

  2. php5.5.7添加pgsql,pdo_pgsql,swoole

    一:下载php源码sudo wget cn2.php.net/distributions/php-X.X.X.tar.gz 二:解压 tar xzf /php-X.X.X.tar.gz 三:进入源码e ...

  3. element-ui 点击获取table的行索引

    <el-table :data="list" v-loading.body="listLoading" element-loading-text=&quo ...

  4. 【环境部署】centos7安装mysql-5.7.19 group-replication

    --mysql高可用官方文档: https://dev.mysql.com/doc/refman/5.7/en/group-replication.html mysql下载地址: https://ww ...

  5. 浏览器端使用javascript调用腾讯翻译api

    最近在学习的小玩意,发现腾讯的文档十分坑爹,里面有很多错误的指示. 不过腾讯的机器翻译还是很牛的,我觉得翻译水准比谷歌好很多. 腾讯的机器翻译貌似在试用阶段,不收费,用QQ或微信登录即可申请使用. 首 ...

  6. nginx的autoindex,目录浏览,配置和美化,美观的xslt_stylesheet

    nginx的autoindex,目录浏览,配置和美化,美观的xslt_stylesheet Nginx custom autoindex with XSLT 转载注明来源: 本文链接 来自osnosn ...

  7. 使用 JavaScript 拦截和跟踪浏览器中的 HTTP 请求

    HTTP 请求的拦截技术可以广泛地应用在反向代理.拦截 Ajax 通信.网页的在线翻译.网站改版重构等方面.而拦截根据位置可以分为服务器端和客户端两大类,客户端拦截借助 JavaScript 脚本技术 ...

  8. php中cookie和session的总结

    cookie: 设置cookie:  setcookie("name","zhang","time()+3600"); 参数一:属性名 参数 ...

  9. web安全类

    web安全类主要分为两个部分:CSRF和XSS 一.CSRF 基本概念:CSRF,通常称为跨站请求伪造,英文名Cross-site request forgery 缩写为CSRF; 怎么防御 1.To ...

  10. 朴素贝叶斯法(naive Bayes algorithm)

    对于给定的训练数据集,朴素贝叶斯法首先基于iid假设学习输入/输出的联合分布:然后基于此模型,对给定的输入x,利用贝叶斯定理求出后验概率最大的输出y. 一.目标 设输入空间是n维向量的集合,输出空间为 ...