radio两行每行只能选择一个的解决方案!

如图,我要做到这个效果,竖着每行只能有一个最像,和最不像,点击左边禁用右边
<div v-else>
<div v-if="progress<quiz.length" class="jumbotronjumbotron-fluid mt-3">
<div class="container" :name="quiz[progress].subjectId">
<h1 class="display-4">
<!--问题-->
{{quiz[progress].subject}}
</h1> 最像 最不像
<div v-for="(item,index) in quiz[progress].items" :key="index"
class="form-check my-4 "> <label class="from-check-label">
<!--单选按钮绑定答题是谁,值为itemsValue-->
<input type="radio" v-on:click="likenessflag(index,item.id)" class="form-check-input" name="likeness" value="item.id" title="最像" >
<input type="radio" v-on:click="unlikeflag(index,item.id)" class="form-check-input" name="unlike" value="item.id" title="最不像" > <span class="badge badge-pill badge-primary mx-3">
{{itemsValue[index]}}
</span>
{{item.title}}
</label>
</div>
思路就是每次点击就解除对面所有数据,然后重新禁用就好了
likenessflag:function(index,v){
$('input[name="unlike"]').attr("disabled",false);
$('input[name="unlike"]')[index].disabled=true;
this.show=false;
},
unlikeflag:function(index,v){
$('input[name="likeness"]').attr("disabled",false);
$('input[name="likeness"]')[index].disabled=true;
this.show=false;
},
radio两行每行只能选择一个的解决方案!的更多相关文章
- menu 一组 只能选择一个
menu 一组 只能选择一个 将属性表的 groupindex 给一个值,假设你有三个Lang选项 就把这三个 manuitemex.groupindex 都设成同一个编号 (ex: 10) 以及把 ...
- 【JS】限制两个或多个单选框最多只能选择一个
$(function () { /*$("#checkbox1").click(function(){ if($(this).attr("checked") = ...
- Ext 编辑 comobox编辑源只能选择一个
storePrType.DataSource = optsvc.Select("28").Where(r => r.OptionID == cmbEngineeringPrT ...
- plupload 限制上传数量 只能选择一张图片上传
var files=[];var errors=[]; var chunk=<%=request.getParameter("chunk")%>; ...
- c# winform DataGridView单击选中一整行,只能单选,不能选择多行,只能选择一行
设置DataGridView的属性SelectionMode为FullRowSelect 这样就使DataGridView不是选择一个字段,而是选择一整行了 设置DataGridView的属性Mult ...
- 要做重试机制,就只能选择 DelayQueue ?其实 RabbitMQ 它上它也行!
原文链接:要做重试机制,就只能选择 DelayQueue ?其实 RabbitMQ 它上它也行! 一.场景 最近研发一个新功能,后台天气预警:后台启动一条线程,定时调用天气预警 API,查询现有城市的 ...
- 当没有用 EXISTS 引入子查询时,在选择列表中只能指定一个表达式。
当没有用 EXISTS 引入子查询时,在选择列表中只能指定一个表达式.比如 select * from T_Employee where FNumber not in ( select top 5* ...
- 选择一个 Python Web 框架:Django vs Flask vs Pyramid
Pyramid, Django, 和 Flask都是优秀的框架,为项目选择其中的哪一个都是伤脑筋的事.我们将会用三种框架实现相同功能的应用来更容易的对比三者.也可以直接跳到框架实战(Framework ...
- 【问题收集·知识储备】Xcode只能选择My Mac,不能选择模拟器如何解决?
网友问题:请问打开一个应用,只能选择My Mac,不能选择模拟器如何解决? 答案: 下面将问答过程记录如下: CHENYILONG Blog 请问打开一个应用,只能 ...
随机推荐
- 题解 CF1103E Radix sum
题目传送门 题目大意 给出一个\(n\)个数的序列\(a_{1,2,..,n}\),可以选\(n\)次,每次可以选与上次选的相同的数,问对于\(\forall p\in[0,n-1]\)满足选出来的数 ...
- 洛谷3176 [HAOI2015]数字串拆分 (矩阵乘法+dp)
qwq真的是一道好题qwq自己做基本是必不可能做出来的. 首先,如果这个题目只是求一个\(f\)数组的话,那就是一道裸题. 首先,根据样例 根据题目描述,我们能发现其实同样数字的不同排列,也是属于不同 ...
- C#开发BIMFACE系列53 WinForm程序中使用CefSharp加载模型图纸1 简单应用
BIMFACE二次开发系列目录 [已更新最新开发文章,点击查看详细] 在我的博客<C#开发BIMFACE系列52 CS客户端集成BIMFACE应用的技术方案>中介绍了多种集成BIM ...
- 痞子衡嵌入式:超级下载算法RT-UFL v1.0在IAR EW for Arm下的使用
痞子衡主导的"学术"项目 <RT-UFL - 一个适用全平台i.MXRT的超级下载算法设计> v1.0 版发布近 4 个月了,部分客户已经在实际项目开发调试中用上了这个 ...
- 大厂面试题系列:重载(Overload)和重写(Override)的区别。重载的方法能否根据返回类型进行区分
面试题:重载(Overload)和重写(Override)的区别.重载的方法能否根据返回类型进行区分 面试官考察点猜想 这道题纯粹只是考查基础理论知识,对实际开发工作中没有太多的指导意义,毕竟编辑器都 ...
- 六个好习惯让你的PCB设计更优
PCB layout工程师每天对着板子成千上万条走线,各种各样的封装,重复着拉线的工作,也许很多人会觉得是很枯燥无聊的工作内容.看似软件操作搬运工,其实设计人员在过程中要在各种设计规则之间做取舍,兼顾 ...
- Ubuntu mysql安装与使用
Ubuntu 下安装 mysql 运行下面的shell代码 #安装mysql sudo apt-get -y install mysql-server sudo apt-get -y install ...
- 『学了就忘』Linux基础 — 17、远程服务器关机及重启时的注意事项
目录 1.为什么远程服务器不能关机 2.远程服务器重启时需要注意两点 3.不要在服务器访问高峰运行高负载命令 4.远程配置防火墙时不要把自己踢出服务器 5.指定合理的密码规范并定期更新 6.合理分配权 ...
- Docker 搭建 Jenkins 持续集成自动化构建环境
1.Docker镜像拉取 Jenkins 环境命令 docker pull jenkins/jenkins:lts 查看下拉取的镜像 docker images 2.通过容器编排方式构建 Jenkin ...
- Centos 7 端口聚合
简单粗暴,直接复制命令就好了 还是先啰嗦一下,添加网卡之后,如果没有网卡配置文件,可以通过nmcli con show 先查看网卡的唯一ID,然后复制其他的网卡配置文件,修改device项,name项 ...