下拉列表框选第一个出现必填,第二个选项不可用

本文介绍了一段JavaScript代码,该代码用于根据下拉列表的选择情况动态改变输入框的状态,包括禁用、启用及设置必填属性等。通过具体实例展示了如何在网页上实现这一功能。

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

在前台的jsp页面体现

function oid(){
            

         
            var val = $("#xid").val();
            if(val == 2){
                $("#wid").val("").prop("disabled",true);
                $("#wid").attr("aria-required","");
                $("#wid").next().remove();
            }else{
                $("#wid").val("").prop("disabled",false);
                $("#wid").attr("aria-required","true");
            }

        }


oid指onchange事件的id

xid指下拉列表的id

wid指后边输入框的id

同时文本框隐藏或者不可用的关键字也要在一开始体现


分享一个小技巧,可以在前台页面的控制台点击到元素,直接把代码写过去来体现效果

<think>好的,我现在需要帮用户设计一个Web项目中新增教材资料功能的全面测试用例。用户提到的几个关键点包括:学校默认第一个录入教材的学校,学段、科目、年级、学期、年份的联动筛,以及教材版本的多功能。我得先理清楚每个功能点,再考虑如何设计测试用例。 首先,关于学校默认第一个。这里可能需要验证当用户进入新增页面时,学校择框是否自动中了第一个学校。需要考虑的情况包括:是否存在多个学校,如果只有一个学校是否默认中,如果没有学校时如何处理,可能显示错误提示或者禁用提交按钮。同时,要确保默认中的学校数据正确,比如是否从后端正确获取并按顺序排列。 接下来是联动筛的部分。学段、科目、年级、学期、年份这几个下拉菜单需要根据前一个择的值动态加载下一个选项。例如,择学段后,科目应该只显示该学段下的科目,年级也应该对应学段的年级范围。这里需要测试每个下拉菜单的联动是否正确,包括择上级选项后,下级选项是否更新,数据是否正确。还需要测试在更改上级选项时,下级选项是否清空或重置。例如,如果用户先了学段A,然后科目了数学,再改学段B,科目应该更新为学段B下的科目,并且数学可能在其中,所以科目应该重置为空或者显示学段B的科目。 另外,联动筛可能存在依赖关系,比如年级依赖于学段和科目,学期和年份可能也有联动。需要测试各种组合情况,确保所有可能的联动关系都正确处理。例如,同的年份,学期是否相应变化,比如某些学年可能分为春季和秋季学期,而同年份可能有同的学期设置。 然后是教材版本的多功能。需要验证用户可以择多个教材版本,且择后的内容正确显示,比如用标签或列展示已版本。同时,要测试多时的边界情况,比如最多能多少个,是否有限制,超过限制时是否有提示。还需要测试删除已版本的功能是否正常,比如点击删除按钮或标签上的关闭图标是否能正确移除选项。 此外,单提交的测试也很重要。需要确保所有必填字段都已填写,并且提交的数据单中填写的一致。例如,提交后后端是否正确接收了学校、学段、科目、年级、学期、年份以及教材版本的多数据。同时,要测试异常情况,比如未填写必填字段时是否提示错误,网络中断时是否有适当的错误处理。 还需要考虑UI和用户体验方面,比如下拉菜单的加载状态是否有提示(如加载中),多组件是否易于操作,联动筛的反应速度是否合理,会让用户感到卡顿。同时,兼容性测试也不能忽视,比如同浏览器、移动设备上的显示和功能是否正常。 安全性和性能方面,可能需要测试输入特殊字符或SQL注入攻击是否被正确处理,以及多用户同时操作系统时响应时间是否在可接受范围内。过用户可能更关注功能测试,所以这部分可以作为补充测试点。 最后,根据用户提供的引用,业务流程涉及多个模块的数据传递,所以需要设计同的数据组合来测试各个模块之间的数据传递是否正确。例如,同学段下科目和年级的组合,或者同年份下学期的选项是否正确。同时,引用中提到要刻意制造错误和极端条件,比如测试在无网络情况下的单提交,或者择非法字符作为输入,观察系统的处理方式。 总结一下,测试用例需要覆盖默认学校择、联动筛的正确性、多功能、单提交验证、异常处理、UI/UX、兼容性、安全性以及性能等方面。每个功能点都需要正常和异常情况的测试用例,确保全面覆盖。</think>### Web项目新增教材资料功能测试用例设计 #### 一、默认学校中逻辑验证 1. **前置条件**:系统中已存在多个学校 **测试步骤**:进入新增教材页面 **预期结果**:学校择框默认第一个录入的学校[^1] 2. **前置条件**:系统中仅有一个学校 **测试步骤**:进入新增教材页面 **预期结果**:学校字段可编辑且自动填充唯一学校[^2] 3. **前置条件**:系统中无学校数据 **测试步骤**:尝试进入新增教材页面 **预期结果**:显示"暂无可用学校"提示,禁用提交按钮 #### 二、学段-科目-年级-学期-年份联动验证 $$ \begin{cases} \text{学段} \rightarrow \text{科目} \rightarrow \text{年级}\\ \text{学期} \leftrightarrow \text{年份} \end{cases} $$ 4. **联动基础测试** - 择小学学段 → 科目显示语文/数学 - 切换为初中学段 → 科目更新为物理/化学 - 择2023年 → 学期显示"2023-2024学年" 5. **异常操作测试** - 先科目后改学段 → 科目自动重置 - 中途清空学段 → 科目/年级置灰禁用 #### 三、教材版本多功能验证 6. **多基础操作** - 勾3个教材版本 → 显示3个标签 - 删除已版本 → 标签实时更新 7. **边界值测试** - 勾最大允许数量(如10个) → 成功提交 - 尝试勾第11个 → 提示"最多择10个版本" #### 四、数据提交验证 8. **正常流程测试** ```python # 模拟提交数据示例 { "school_id": 101, "stage": "初中", "subject": "物理", "versions": ["人教版", "北师大版"] } ``` **预期结果**:数据库记录与数据完全一致[^3] 9. **异常数据测试** - 必填字段留空 → 显示红色警示框 - 输入特殊字符`<script>` → 自动过滤并提示 #### 五、性能与兼容性测试 10. **压力测试** - 同时500用户操作联动 → 响应时间<2秒 11. **跨平台验证** - Chrome/Firefox/Safari → 多组件现一致 - 手机端操作 → 下拉菜单自动适配触屏
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值