问题描述
请教一个问题：如何用jQuery获取左边那列“删除/批量”下选中的复选框，并在按“删除/批量”那个<a></a>标签后，把相关值提交到另一个页面去？求教！
解决方案
a.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script type="text/javascript" src="jquery-1.7.1.js"></script><script type="text/javascript">$(function() {$("#allche").bind("click", function() {var ches = $(this).attr("checked");if (!ches) {ches = false;}$.each($("#tCks :checkbox"), function(idx, val) {$(val).attr("checked", ches);});});$("#send").bind("click", function() {var aId = [];$.each($("#tCks :checked"), function(idx, val) {aId.push($(this).val());});if (aId.length == 0) {alert("请选择删除项");return false;}var ids = aId.join(",");//使用1，或者使用2和3都可以$(this).attr("href", "b.jsp?ids=" + ids); // 1//window.location.href = "b.jsp?ids=" + ids; //2//return false; //});});</script></head><body><a id='send' href='send();'>批量删除</a><table border="1" width="80%"><thead><tr><th width="25px"><input type="checkbox" id="allche" /></th><th>id</th><th>name</th><th>age</th></tr></thead><tbody id="tCks"><%for (int i = 1; i < 4; i++) {%><tr><td><input type="checkbox" value="<%=i%>" /></td><td><%=i%></td><td>name_<%=i%></td><td>24</td></tr><%}%></tbody></table></body></html>b.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body><%String ids = request.getParameter("ids");String[] aId = ids.split(",");//拿到删除用户的id数组了，将aId传递到你的数据操作部分，进行删除即可。%>你要删除的用户ID为<%=ids%></body></html>这里不管你是不是使用servlet还是jsp都是一样的。如果你使用的是servlet，那么把$(this).attr("href", "b.jsp?ids=" + ids);中的b.jsp换成你的servlet名称就行了，然后在该servlet中使用request.getParameter("ids");也就是b.jsp页面的代码进行获取就行了。最后将得到的id数组传到数据处理层进行处理就行了。当然这里建议不要使用href的形式，你可以提供个form表单，把选中的值放在一个隐藏域中机型表单提交，那样做也是可以的，要改动的就是在js中拿到选择的checked值，也就是var aId = [];$.each($("#tCks :checked"), function(idx, val) {aId.push($(this).val());});后,把aId.join(',')的值付给你的隐藏变量既可以，让后让form表单submit即可。这个你可以自己尝试下。我想我已经写的很明白了，如果还是弄不来那就再的无语了。呵呵，祝好运气了！
解决方案二：
你可以在检索的时候多检索出一个自增字段。然后把那个字段的值放到CHECKBOX中。然后就可以根据那个值得到相应选择的行的记录！
解决方案三：
注意用超链接提交时get方法。对应你servlert中的doGet方法
解决方案四：
引用大侠，我按照你的方法改了，为什么会出现： HTTP Status 404 - /clubSys/return%20test(); 呢 呵呵，我只是随便写的，没经过测试。吧那个return去掉就行了function test(){//reuturn false; //如果返回false则不超链接window.location.href = "http://www.sina.com.cn";}<a href="javascript:test();">test</a>
解决方案五：
引用可是我这个不是预先定义好的checkbox哦，是看数据库里的表有多少条记录，就在那条记录前加一个checkbox哦。 给你个方法把，代码家里没有！首先你的table的如下写法： <tr> <th width="84" scope="col"><a href="return test();">删除/批量</a></th> <th width="146" scope="col">会员编号</th> <th width="92" scope="col">会员姓名</th> <th width="52" scope="col">会员性别</th> <th width="58" scope="col">联系电话</th> <th width="220" scope="col">Email地址</th> </tr> <tbody id="ches"> <c:forEach var="p" items="${requestScope.lst}"> <tr> <td><input type="checkbox" name="chose" value="${p.userId"/></td> <td>${p.userID}</td> <td>${p.userName}</td> <td>${p.userSex}</td> <td>${p.userPhone}</td> <td>${p.email}</td> </tr> </c:forEach> </tbody> 1、这里加<tbody>的原因是为了方便使用jquery选择器选中<tboby>中的checkbox2、checkbox元素加上value属性，value属性的值就是每条记录的主键，比如用户id3、删除/批量的连接改成调用一个javascript:return test()那么做法就是在点击链接时出发test函数，该函数用于获取指定tbody元素中被选中的checkbox元素，那么会得到一个数组，我们for这个数组将input元素的value值拿出来放在一个数组里，然后使用join(",")隔开后在设定href元素既可以了。在跳转页面我们在split这个字符串拿到要删除的所有数据id进行批量删除就可以。test大概这样写吧function test(){var ches = $("#ches : checked");if(ches.length == 0){alert("请选择");return false;}var uIds = [];$.each($(ches),function(idx,val){uIds.push($(val).val());});var us = uIds.join(",");window.local.href = "manager.jsp?uids="+us;}这样发出的连接请求肯定是 manger.jsp？uids=1,2,3,4,5这个样子。上面的代码大概就这个样子，具体的你可以看下jqury 的api.不过思想及这样，至于代码怎么写，有了思想还怕写不出代码么! 呵呵ps:如果还是弄不出来，那就等周一去了给你找完整的代码了，在家实在是懒的写代码。
解决方案六：
把你的table放到form表单中，列表显示循环做如下修改：<c:forEach var="p" items="${requestScope.lst}"> <tr> <td><input type="checkbox" name="chose" value ="<c:out value='${p.userID}'/>" /></td> <td>${p.userID}</td> <td>${p.userName}</td> <td>${p.userSex}</td> <td>${p.userPhone}</td> <td>${p.email}</td> </tr> </c:forEach> 给你的a标记添加一个onclick事件，负责提交表单，<a href="javascript:submit()">在后台action中通过request.getParameterValues()获得一个string类型的数组，这个数组中的值就是你选择行的id，可以根据这个id进行你所需要的操作。
解决方案七：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>"> <title>My JSP 'process.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script type="text/javascript" src="jquery-1.4.1.js"></script><script type="text/javascript">$(document).ready(function(){//alert("xxxx");$('#removebtn').click(function(){var checked = $("input[name='chose']:checked"); var selectedId = [];checked.each(function(_index,_el){selectedId.push(_el.value);});alert("manager.jsp?code="+selectedId.join(","));//document.location.href="manager.jsp?&code="+selectedId.join(",");});});</script> </head> <body> <table width="745" border="1" cellspacing="0"> <!--表头标题行--> <tr> <td>会员信息管理sss</td> </tr> <tr> <th width="84" scope="col"><a href="javascript:void(0)" id="removebtn">删除/批量</a></th> <th width="146" scope="col">会员编号</th> <th width="92" scope="col">会员姓名</th> <th width="52" scope="col">会员性别</th> <th width="58" scope="col">联系电话</th> <th width="220" scope="col">Email地址</th> </tr> <c:forEach var="p" items="${requestScope.lst}"> <tr> <td><input type="checkbox" name="chose" /></td> <td>${p.userID}</td> <td>${p.userName}</td> <td>${p.userSex}</td> <td>${p.userPhone}</td> <td>${p.email}</td> </tr> </c:forEach> <tr> <td><input type="checkbox" name="chose" value="1"/></td> <td>a</td> <td>b</td> <td>c</td> <td>d</td> <td>f</td> </tr> <tr> <td><input type="checkbox" name="chose" value="2"/></td> <td>a2</td> <td>b2</td> <td>c2</td> <td>d2</td> <td>f2</td> </tr> <tr> <td><input type="checkbox" name="chose" value="3"/></td> <td>a3</td> <td>b3</td> <td>c3</td> <td>d3</td> <td>f3</td> </tr> </table> </body></html>
解决方案八：
为什么一定要用<a>随便一个onclick 写个方法把参数就传递过去了
解决方案：
取得选中的复选框var checked = $("input[name='chose']:checked");返回的是一个数组，值为被选中的checkbox的dom信息引用并在按“删除/批量”那个<a></a>标签后，把相关值提交到另一个页面去可以在<a>上添加事件function tijiao(){var checked = $("input[name='chose']:checked");//在这里把选中的checkbox拼装成query参数加到提交的url里，用location.href=url+checked。就可以了//或者自己创建一个form，post方式提交，//再或者ajax提交}