JQuery通过checkbox实现批量删除

前几天在一个freemark模版的html文件中通过checkbox批量删除出现了一系列的问题：

要删除就必须获取要删除的数据的id号，通过相对应的checkbox是否有打勾来判断要不要获取该数据的id号。问题就是通过checkbox获取相对应的id。

	<#if list??> <#list list as messageDto>
				<tr>
					<td class="tdMessageChecked">
						<input type="checkbox" name="subBox">
					</td>
					<td class="tdMessageId">
						${messageDto.id}
					</td>
				</tr>
				</#list> </#if>

就是需要通过name是subBox的checkbox获取class="tdMessageId"里面的值。

解决办法的js代码如下：

$(document).ready(function() {
			$("#delete").click(function() {
						var i = 0;
						var deleList = new Array();
						$(".tdMessageChecked").each(function() {
									if ($(this).children().attr("checked")) {
										i++;
										deleList[i] = $(this).siblings().eq(0)
												.text();
									}
								})

						$.post("/Bo/message/deletelist", 
								{
									par : deleList.toString()
								}, 
								function() {
									$("#selectForm").submit();
									var m = document
											.getElementsByName('subBox');
									for (var i = 0; i < m.length; i++) {
										m[i].checked == false
									}
								})
					})
		})

首先是判断checkbox是否已经选中，由于使用了freemarker的<#list>标签进行循环，循环过程中，用到了${this}，而不能再用简单的写在一个$("")里面的选择器。

需要用到一些方法类获取实现选择器的功能。

if ($(this).children().attr("checked")) {
										i++;
										deleList[i] = $(this).siblings().eq(0)
												.text();
									}

上面是在判断checkbox是否被选中的时候用到.attr("checked")就能获取，但这里又有情况，如果用alert(attr("checked"))输出并不是true或false，而是checked或undefined。好奇怪。实现选择器的方法有：

.children()      子元素选择器    等同于     $("parent>child")

.siblings()       相邻同辈元素选择器   等同于   $("prev~siblings")

.parent()        父亲元素选择器    

.eq()         上例中是获取到了同辈的元素的集合，该函数可以根据序号取到相应的元素

.text()       获取<td></td>标签中的内容

上例中获取到了需要删除的id号的集合后，用了$.post()方法提交。

参数url为

"/Bo/message/deletelist",

需要传到后台的参数：表示把数组delelist传值给par,后台通过request.getParameter("par");即可取到相应的值。不过此处传过去的是字符串，需要后台作相应的处理。如果有多个值，需要用｛｝包围。

{
									par : deleList.toString()
								},

回调函数，在请求完成后需要进行的操作：此处是把选中的checkbox去掉（因为是用到了freemarker的list循环，去掉是数据后checkbox序号变化，还有有相应未知的checkbox被选中，需要去掉）。

function() {
									$("#selectForm").submit();
									var m = document
											.getElementsByName('subBox');
									for (var i = 0; i < m.length; i++) {
										m[i].checked == false
									}
								})