$(function() { $("input:checkbox").click(function() { //试题编号 var checked = $(this).attr("id"); //试题对应的分数 var score = $(this).parent().siblings("#subjectScore").text(); //维持已选试题数量 var choosed = parseInt($("#choosed").text()); if(this.checked) { $("#choosed").text(choosed+1); } else { $("#choosed").text(choosed-1); } //获取试卷编号 var examPaperId = $("#examPaperId").text(); if(examPaperId == null || examPaperId.trim() == "") { alert("无法获取试卷信息,暂时无法添加!"); return false; } $.ajax({ type: "POST", data: "subjectID="+checked+"&score="+score+"&exampaperID="+examPaperId, url: "getChooseSubId", success: function(data) { if(data.trim().indexOf("f-exists-") != -1) { zeroModal.show({ title : "错误的提交", content : "此试题已经存在该试卷中了!", width : '200px', height : '130px', overlay : false, ok : true, onClosed : function() { //刷新当前页面 //location.reload(); } }); var choosed = parseInt($("#choosed").text()); $("#choosed").text(choosed-1); //截取题号 var subjectId = data.substring(data.lastIndexOf("-")+1); //移除选择 $("#"+subjectId).replaceWith("<span style='color:red;font-size:12px;'>exists</span>"); return false; } }, error: function(data) { alert("提交失败"); } }); });
时间: 2023-06-20 21:06:21 浏览: 158
这是一段 jQuery 的代码,它监听了多选框的点击事件。当用户点击多选框时,它会获取试题的编号和对应的分数,然后将已选试题的数量加1。接着,它会获取试卷的编号并发送一个 AJAX 请求,将选中的试题的编号、分数和试卷的编号一起发送给服务器。如果服务器返回的数据中包含"f-exists-"字符串,说明这道试题已经存在于该试卷中,此时会弹出一个提示框告诉用户这一信息,并将已选试题的数量减1,同时将该试题的多选框替换成一个文本标记。如果服务器返回的数据不包含"f-exists-"字符串,说明该试题可以被添加到试卷中。
相关问题
$(".ckpatients_check #AllCheck").click(function () { if (this.checked == true) { var pid = ""; var pid2 = ""; $(".ckpatients_check input[type=checkbox]").prop("checked", true); $(".ckpatients_check input[type=checkbox]").not("#AllCheck").each(function (i) { pid += this.value + "¤"; pid2 += this.value + "|" + $(this).next().val() + "¤"; }); $("#PatientIDList")[0].value = pid; $("#PatientIDBedNoList")[0].value = pid2; //$(".patients_name_information ul li").css("color", "rgb(51, 122, 183)"); $(".patients_name_information ul li").css("background", "rgb(186,231,255)"); } else { $(".ckpatients_check input[type=checkbox]").prop("checked", falsle); $("#PatientIDList")[0].value = "undefined"; $("#PatientIDBedNoList")[0].value = "undefined"; //$(".patients_name_information ul li").css("color", "Black"); $(".patients_name_information ul li").css("background", ""); } sessionStorage.setItem("searchPatientIDBedNoList", $("#PatientIDBedNoList")[0].value); sessionStorage.setItem("searchPatientIDList", $("#PatientIDList")[0].value); });
这段代码是一个点击事件的处理函数。当点击了具有类名为"ckpatients_check"的元素下的id为"AllCheck"的复选框时,执行以下逻辑:
1. 检查复选框的状态是否为选中(checked == true)。
2. 如果复选框被选中,则执行以下操作:
- 将具有类型为checkbox的所有输入框的checked属性设置为true。
- 遍历除了id为"AllCheck"之外的所有具有类型为checkbox的输入框,将它们的value值以"¤"分隔拼接到pid变量中,并以"value|next().val()¤"的形式拼接到pid2变量中。
- 将拼接好的pid值赋给id为"PatientIDList"的元素的value属性。
- 将拼接好的pid2值赋给id为"PatientIDBedNoList"的元素的value属性。
- 将具有类名为"patients_name_information"下的ul中的li元素的背景色设置为"rgb(186,231,255)"。
3. 如果复选框未被选中,则执行以下操作:
- 将具有类型为checkbox的所有输入框的checked属性设置为false。
- 将id为"PatientIDList"的元素的value属性设置为"undefined"。
- 将id为"PatientIDBedNoList"的元素的value属性设置为"undefined"。
- 将具有类名为"patients_name_information"下的ul中的li元素的背景色设置为空。
4. 将拼接好的pid2值存储在名为"searchPatientIDBedNoList"的sessionStorage中。
5. 将拼接好的pid值存储在名为"searchPatientIDList"的sessionStorage中。
<script> //反选 function changeCheck() { // 获取所有的复选框元素 var checkboxs = document.getElementsByTagName('input'); // 遍历所有复选框 for (var i = 0; i < checkboxs.length; i++) { // 如果当前元素是复选框,而且它的类型是checkbox if (checkboxs[i].type == 'checkbox') { // 判断当前复选框是否选中 if (checkboxs[i].checked) { // 如果选中,就取消选中 checkboxs[i].checked = false; } else { // 如果没有选中,就选中它 checkboxs[i].checked = true; } } } } $(function() { // 删除功能 $(".delete_item").click(function() { $(this).closest("tr").remove(); }); // 批量删除功能 $("#deleteAll").click(function() { $(".check_item:checked").each(function() { $(this).closest("tr").remove(); }); }); }); </script> </head> <body> <table> <thead> <tr> <th><button type="checkbox" id="allsel" onclick="changeCheck(this)">反选</button></th> <th>用户ID</th> <th>爱好</th> <th>家庭住址</th> <th>操作</th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" class="check_item"></td> <td>1</td> <td>跑步</td> <td>江苏省无锡市</td> <td><button class="delete_item">删除</button></td> </tr> <tr> <td><input type="checkbox" class="check_item"></td> <td>2</td> <td>打球</td> <td>江苏省南京市</td> <td><button class="delete_item">删除</button></td> </tr> <tr> <td><input type="checkbox" class="check_item"></td> <td>3</td> <td>跳舞</td> <td>安徽省合肥市</td> <td><button class="delete_item">删除</button></td> </tr> <tr> <td><button class="deleteAll">批量删除</button></td>怎么可以批量删除和删除
要实现批量删除和删除功能,你需要将 HTML 代码中的批量删除按钮的类名修改为 "delete_item",即将 `<button class="deleteAll">批量删除</button>` 修改为 `<button class="delete_item">批量删除</button>`。这样,批量删除和删除按钮都可以使用类名为 "delete_item" 的类名进行触发了。
在 JavaScript 代码中,当删除按钮或批量删除按钮被点击时,使用 jQuery 的 `click` 方法来为它们绑定事件。当删除按钮被点击时,使用 `closest` 方法获取到该按钮所在的 `tr` 元素,并将其从 DOM 树中移除:
```javascript
$(".delete_item").click(function() {
$(this).closest("tr").remove();
});
```
当批量删除按钮被点击时,使用 jQuery 的 `each` 方法遍历所有被选中的复选框,再使用 `closest` 方法获取到每个复选框所在的 `tr` 元素,并将其从 DOM 树中移除:
```javascript
$(".delete_item").click(function() {
$(".check_item:checked").each(function() {
$(this).closest("tr").remove();
});
});
```
阅读全文