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 请问打开一个应用,只能 ...
随机推荐
- FFT 的一些技巧
三次变两次 FFT 我们发现: \[(F(x)+iG(x))^2=F(x)^2-G(x)^2+2iF(x)G(x) \] 也就是说,我们把 \(F(x)\) 作为实部,\(G(x)\) 作为虚部,那么 ...
- jenkins+allure中测试包括为空,没有数据
- 从网络通信的演进过程彻底搞懂Redis高性能通信的原理(全网最详细,建议收藏)
我们一直说Redis的性能很快,那为什么快?Redis为了达到性能最大化,做了哪些方面的优化呢? 在深度解析Redis的数据结构 这篇文章中,其实从数据结构上分析了Redis性能高的一方面原因. 在目 ...
- Flask的环境配置
Flask django是大而全,提供所有常用的功能 flask是小而精,只提供核心功能 环境配置 为了防止 django和 flask环境相互冲突,可以使用 虚拟环境分割开 pip instal ...
- Caterpillar的启动以及自动化启动脚本
Caterpillar的启动以及自动化启动脚本 Caterpillar是基于以太坊的BPMS,建模的BPMN图形可被Caterpillar转化为solidity程序部署到以太坊中. Caterpill ...
- 提高微信小程序的应用速度
一.是什么 小程序启动会常常遇到如下图场景: 这是因为,小程序首次启动前,微信会在小程序启动前为小程序准备好通用的运行环境,如运行中的线程和一些基础库的初始化 然后才开始进入启动状态,展示一个固定的启 ...
- Beta阶段第六次会议
第六次会议 时间:2020.5.22 完成工作 姓名 任务 难度 完成度 xyq 1.编写技术博客 中 90% ltx 1.编写小程序2.添加全局变量之后页面无法加载的bug 中 90% lm(迟到) ...
- poi实现生成下拉选联动
在我们实际的程序开发中,经常需要用到从excel导入数据中系统中,而为了防止用户在excel中乱输入文字,有些需要用到下拉选的地方,就需要从程序中动态生成模板.本例子简单的讲解一下,如何生成级联下拉选 ...
- USB线上/串口/I2C引脚串联电阻的作用
对引脚的保护. 第一是阻抗匹配.因为信号源的阻抗很低,跟信号线之间阻抗不匹配,串上一个电阻后,可改善匹配情况,以减少反射,避免振荡等. 第二是可以减少信号边沿的陡峭程度,从而减少高频噪声以及过冲等.因 ...
- 洛谷 P5665 [CSP-S2019] 划分
链接: P5665 题意: 给出 \(n\) 个整数 \(a_i\) ,你需要找到一些分界点 \(1 \leq k_1 \lt k_2 \lt \cdots \lt k_p \lt n\),使得 \( ...