jsp 表格中 判断复选框选中后如何读取出并显示所在这一行数据
jsp页面如下：<tablealign="center"class="pageTabe"><tr><td>书名</td><td>价格</td><td>库存</td><td...
jsp页面如下：
<table align="center" class="pageTabe" >
<tr>
<td>书名</td>
<td>价格</td>
<td>库存</td>
<td align="right">图片预览</td>
</tr>
<tr>
<td><input type="checkbox" name="channel" />泰戈尔诗集</td>
<td>$18.00</td>
<td>985</td>
<td align="right"> 暂无</td>
</tr>
<tr>
<td><input type="checkbox" name="channel" />痕迹</td>
<td>22</td>
<td>981</td>
<td align="right">暂无</td>
</tr>
<tr>
<td><input type="checkbox" name="channel" />天堂之旋</td>
<td>$25</td>
<td>991</td>
<td align="right">暂无</td>
</tr>
<tr>
<td rowspan="4" style="text-align:center; vertical-align:middle;">
<ul class="shopfoot">
<li><a href="#">首页</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">尾页</a></li>
</ul>
<span class="addShopping"><a href="#" >加入购物车</a></span>
</td>
</tr>
</table> 展开
<table align="center" class="pageTabe" >
<tr>
<td>书名</td>
<td>价格</td>
<td>库存</td>
<td align="right">图片预览</td>
</tr>
<tr>
<td><input type="checkbox" name="channel" />泰戈尔诗集</td>
<td>$18.00</td>
<td>985</td>
<td align="right"> 暂无</td>
</tr>
<tr>
<td><input type="checkbox" name="channel" />痕迹</td>
<td>22</td>
<td>981</td>
<td align="right">暂无</td>
</tr>
<tr>
<td><input type="checkbox" name="channel" />天堂之旋</td>
<td>$25</td>
<td>991</td>
<td align="right">暂无</td>
</tr>
<tr>
<td rowspan="4" style="text-align:center; vertical-align:middle;">
<ul class="shopfoot">
<li><a href="#">首页</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">尾页</a></li>
</ul>
<span class="addShopping"><a href="#" >加入购物车</a></span>
</td>
</tr>
</table> 展开
3个回答
2016-01-12 · 做真实的自己 用良心做教育
千锋教育
千锋教育专注HTML5大前端、JavaEE、Python、人工智能、UI＆UE、云计算、全栈软件测试、大数据、物联网+嵌入式、Unity游戏开发、网络安全、互联网营销、Go语言等培训教育。
向TA提问
关注
![]()
展开全部
jsp 表格中如果复选框选中，需要触发一个事件，获取数据并显示。
参考例子如下：
<input type="checkbox" name="atitle" value="历史名胜"><label>历史名胜</label>
<input type="checkbox" name="atitle" value="南方故事"><label>南方故事</label>
<input type="checkbox" name="atitle" value="职场故事"><label>职场故事</label>
<input type="checkbox" name="atitle" value="情感故事"><label>情感故事</label>
<input type="chec<A onClick="check();return false;" >提交</A>
<script type="text/javascript">
function check(){
var chk_value =[];
$('input[name=atitle]:checked').each(function(){
chk_value.push($(this).val());
});
// chk_value=[历史名胜,南方故事,职场故事,情感故事,传奇解谜]
//chk_value应该是这样子.
$.ajax({
type: "post",
url: convertURL('up-ajx.jsp'),
// data: {atitle:$('input[name=atitle]').val()},
//如果是这样子是可以正常传送的.但只能是第一个值.
data:'atitle='+chkvalue,
//这样好像是不行,现在问题就是出在这里,atitle如何同时等多个值.
//up-ajx.jsp里是通过 Request.Form("atitle")来获取的.可果的直接用jsp是可以正常运行的.
dataType: "json",
error: function(){alert('出错了，您没有选择选项。');},
success: function(msg){
alert(msg)
}
});
}
</script>
参考例子如下：
<input type="checkbox" name="atitle" value="历史名胜"><label>历史名胜</label>
<input type="checkbox" name="atitle" value="南方故事"><label>南方故事</label>
<input type="checkbox" name="atitle" value="职场故事"><label>职场故事</label>
<input type="checkbox" name="atitle" value="情感故事"><label>情感故事</label>
<input type="chec<A onClick="check();return false;" >提交</A>
<script type="text/javascript">
function check(){
var chk_value =[];
$('input[name=atitle]:checked').each(function(){
chk_value.push($(this).val());
});
// chk_value=[历史名胜,南方故事,职场故事,情感故事,传奇解谜]
//chk_value应该是这样子.
$.ajax({
type: "post",
url: convertURL('up-ajx.jsp'),
// data: {atitle:$('input[name=atitle]').val()},
//如果是这样子是可以正常传送的.但只能是第一个值.
data:'atitle='+chkvalue,
//这样好像是不行,现在问题就是出在这里,atitle如何同时等多个值.
//up-ajx.jsp里是通过 Request.Form("atitle")来获取的.可果的直接用jsp是可以正常运行的.
dataType: "json",
error: function(){alert('出错了，您没有选择选项。');},
success: function(msg){
alert(msg)
}
});
}
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
随便写了下，代码有点多，但是逻辑很简单，你看看是不是要这种效果的，注意这个html文件要跟jquery的js文件放在一个目录下哈
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>复选框 </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<SCRIPT LANGUAGE="JavaScript" src="jquery-1.5.1.js"></SCRIPT>
<script>
jQuery(document).ready(function(){
jQuery("#yuwen").click(function(){
if(jQuery("#yuwen").attr("checked")==true){
jQuery("#div1").append(" 语文");
}else{
var content = jQuery("#div1").html();
content = content.replace("语文","");
jQuery("#div1").html(content);
}
});
jQuery("#s").click(function(){
if(jQuery("#s").attr("checked")==true){
jQuery("#div1").append(" 数学");
}else{
var content = jQuery("#div1").html();
content = content.replace("数学","");
jQuery("#div1").html(content);
}
});
jQuery("#y").click(function(){
if(jQuery("#y").attr("checked")==true){
jQuery("#div1").append(" 英语");
}else{
var content = jQuery("#div1").html();
content = content.replace("英语","");
jQuery("#div1").html(content);
}
});
});
</script>
</head>
<body>
<input type="checkbox" name="t" value="1" id="yuwen"/>语文
<input type="checkbox" name="t" value="2" id="s"/>数学
<input type="checkbox" name="t" value="3" id="y"/>英语
<div id="div1"></div>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>复选框 </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<SCRIPT LANGUAGE="JavaScript" src="jquery-1.5.1.js"></SCRIPT>
<script>
jQuery(document).ready(function(){
jQuery("#yuwen").click(function(){
if(jQuery("#yuwen").attr("checked")==true){
jQuery("#div1").append(" 语文");
}else{
var content = jQuery("#div1").html();
content = content.replace("语文","");
jQuery("#div1").html(content);
}
});
jQuery("#s").click(function(){
if(jQuery("#s").attr("checked")==true){
jQuery("#div1").append(" 数学");
}else{
var content = jQuery("#div1").html();
content = content.replace("数学","");
jQuery("#div1").html(content);
}
});
jQuery("#y").click(function(){
if(jQuery("#y").attr("checked")==true){
jQuery("#div1").append(" 英语");
}else{
var content = jQuery("#div1").html();
content = content.replace("英语","");
jQuery("#div1").html(content);
}
});
});
</script>
</head>
<body>
<input type="checkbox" name="t" value="1" id="yuwen"/>语文
<input type="checkbox" name="t" value="2" id="s"/>数学
<input type="checkbox" name="t" value="3" id="y"/>英语
<div id="div1"></div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
1.需要是用javascript实现。
2.具体是在复选框选中时，弹出内容？还是在点击 加入购物车 时，弹出内容？
3.鉴于所说“所在这一行的数据”，给个例子供参考。
使用了jquery，偷下懒，呵呵。
<script language="javascript">
$(function(){
$(".addShopping").click(function(){
$.each($(":checked"),function(){
alert($(this).parent().parent().get(0).outerHTML);
});
});
});
</script>
2.具体是在复选框选中时，弹出内容？还是在点击 加入购物车 时，弹出内容？
3.鉴于所说“所在这一行的数据”，给个例子供参考。
使用了jquery，偷下懒，呵呵。
<script language="javascript">
$(function(){
$(".addShopping").click(function(){
$.each($(":checked"),function(){
alert($(this).parent().parent().get(0).outerHTML);
});
});
});
</script>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
