布局样式效果如上图，源代码的编写请自行考虑，就当是给大家的小小测试，毕竟HTML的编写是很基础的啦
$(function () { //页面加载时间中调用绑定下拉框数据 layui.use(‘layer’, function () { layer = layui.layer; }); AppendOption(); });
绑定下拉框数据
function AppendOption() { appendOption(“科目类型的ID”, “查询科目类型数据的方法路径”); appendOption(“题目类型的ID”, “查询题目类型数据的方法路径”); appendOption(“适用单位的ID”, “查询适用单位的方法路径”); appendOption(“难度系数的ID”, “查询难度系数的方法路径”); $("#科目ID").change(function () { //根据科目类型ID改变知识点ID事件 var 科目ID= parseInt(this.value); appendOption(“所要改变值ID（知识点ID）”, "根据科目类型ID查询知识点的方法路径= " + 科目ID); }); }
自己封装的方法 使用jQuery根据URL路径创建下拉框，使用到的参数id（form的id）、url（查询下拉框的URL路径）
function appendOption(id, url) { $.getJSON(url, function (data) { $("#" + id).empty(); $("#" + id).append("" + “----请选择----” + “”); $.each(data, function (i) { $("#" + id).append("" + data[i].text + “”); }); }); } //删除选项 function DeleteAnswer() { var optionCount = $("#addOptions").find(".form-row").length; if (optionCount > 2) { $("#addOptions").find(".form-row").last().remove();//找到最后一项进行删除操作 } else { layer.msg(“A、B选项不能移除！”, { icon: 0, skin: “layui-layer-molv” }); }
代码解析： 1、 给答案选项进行编号并且定义一个数组来存储，是为了限制选项的范围。正常的选项范围是A-D，偶尔也会是A-G。 2、 添加选项功能是对单选题或者是多选题的选项进行添加，当然添加选项的范围必须是在答案选项数组规定的范围之内。 3、 题目类型为判断题不能进行添加选项操作，超出选项范围进行提示，“已经是最后一个选项了，不能再进行添加选项操作！”。 4、 添加选项的内容使用字符串拼接保存到数据库 5、 删除选项主要是对单选题或者是多选题的选项进行删除，找到答案选项中的最后一项进行删除，最多删除到B选项（A、B选项不能进行删除）。
手动导入功能分析总结： 1、 下拉框数据的绑定以及下拉框数据的改变事件 2、 题目类型的切换（判断题型是判断题还是单选题或者是多选题） 3、 添加选项、删除选项 4、 文件的添加（涉及到图片文件的下载和添加详细看下期）
