选项按钮功能的添加和删除

本文探讨了在MVC框架下如何实现选项功能,重点介绍了题型判断、选项添加与删除的逻辑处理,确保不同题型(如判断题、单选题、多选题)的正确操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

开发工具与关键技术:MVC
作者:胡名权
撰写时间:2019年5月15日

选项功能在我们的生活中可以说是很常见的,我们考试的选择题,网页的选项,游戏的角色选择等等,都涉及到了选项的用处。那么,我们这次就一起来探讨一下有关选项功能的写法。那么我们需要来到视图,我们就用题型的例子来讲解一二。
首先我们先封装它的方法,在进行选项的添加或删除前,我们还需要进行一个判断,那就是判断它的题型。因为要判断现在的题型是判断题,单选题,还是多选题。只有先判断清楚它的题型我们才能进行下一步操作。如果它是一个判断题,我们也能添加选项,那么添加出来应该显示什么呢?√亦或是×?,这都不符合常理,不符合现实规律,所以我们在添加删除按钮前必须先进行判断它此时的题型以便我们能更好的进行下一步。
那么我们需要先来获取它的题目的题型,
var titleTypeID = this, Value;//获取题目类型ID值
var inputs = $("#addOptions").find(".form-row").find(“input”);
如果它为判断题,那么就只能有两个选项,就不能添加了。既然是判断题我们就要对选项进行处理,不管它现在是不是只有两个选项,我们都要进行删除多余的选项这一操作,来确保我们的万无一失,才不会出错。我们就接着判断:
在这里插入图片描述

如果以上条件都不符合就得出该题型为单选题或多选题,那么我们就要把判断题已经有的“√”,“×”选项内容去除,

if (inputs[0].value == "√" || inputs[1].value == "×") {
                    inputs[0].value == "";
                    inputs[1].value == "";

去除以后还要把判断题的只读模式取消,因为判断题我们是不能添加选项的就直接给它设置的只读模式。inputs[0].readOnly = false;//取消只读模式
inputs[1].readOnly = false;
有了这一步操作以后,我们就能进行选项的添加和删除了。
先封装添加选项的方法,然后获取题目类型的ID值。
var titleTypeID = $("#TitleType").val()//获取题目类型ID值
接着判断是否获取到数据,判断是否为零,不为零就继续判断它的题型是怎样的
if (titleTypeID != 0) {
if (titleTypeID == 3) {//说明题目类型为判断题
layer.msg(“题目类型为判断题,不能添加选项”, { icon: 0, skin: “layui-layer-molv” });
如果以上条件不满足,则进行如下操作:
在这里插入图片描述

在我们添加选项的时候也要进行一个判断就是时候已经到了规定好的答案个数选项,进行判断。
否则就是用户没有选择题目类型,我们就提示用户“题目类型不能为空”
else {//未选择题目类型
layer.msg(“题目类型不能为空”,
{ icon: 0, skin: “layui-layer-molv” });
}
添加的内容就到这里了,接下来就是删除选项功能了。
删除也是一样的做法,那么,我们就一起来看看吧。
在这里插入图片描述

那么也是一样,我们先获取选项的长度来判断选项是判断题还是单选题还是多选题。
最后得出的题型再进行相应的处理。
如果只剩下两个选项的时候我们也是不能再进行删除操作的了,因为判断题只能是两个选项,其他类型的题也是一样,最少要剩下两个选项才能符合现实规律,不然还要出题干嘛呢,还要学习什么,都是满分,就不要老师了。所以最少也得保留两个选项。
那么选项的添加和删除功能就结束了。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值