各位大侠,请大家看下以下代码,如何修改才能获得“红色字”那里的功能,谢谢各位了!------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
//级别选择框
$("#table1 tr:eq(0) td input:checkbox").click(function(){
if(this.checked==true){
var trID = "tr_"+$(this).attr("id"); //行id
//新增行,注意行id
$("#table2").append("<tr id='"+trID+"'><td>"+$(this).val()+":<input type='text' name='jibie_val' value='"+trID+"' /> </td><td></td></tr>");
//新增级别行前, 如果有些科目已选择,则要添加
var $checkd = $("#table1 tr:eq(1) td input:checkbox:checked"); //获取已选择的科目
if($checkd.length>0){ //如果有科目被选中,循环加到第二个单元格
$checkd.each(function(){
$("#table2 #"+trID+" td:odd").append("<div class='div_"+$(this).attr("id")+"'>"+$(this).val()+":<input type='text' name='"+$(this).attr("id")+"'/>["+trID+"]</div>");
});
}
}
else{
$("#table2 #tr_"+$(this).attr("id")).remove();}
});
//科目选择框
$("#table1 tr:eq(1) td input:checkbox").click(function(){
if($("#table2 tr").length>0){ //只有级别有一个或以上被选择,才可以选择科目
if(this.checked==true){
$("#table2 tr td:odd").append("<div class='div_"+$(this).attr("id")+"'>"+$(this).val()+":<input type='text' name='"+$(this).attr("id")+"'/>[<font color='#FF0000'>这里也要获得trID的值</font>]</div>");
}
else{
$("#table2 tr td:odd").find(".div_"+$(this).attr("id")).remove();
}
}
else{
this.checked=false;
}
});
})
</script>
</head>
<body>
<table class="tableBorder" width="100%" border="0" cellspacing="1" bgcolor="#eff0eb" id="table1">
<tr bgcolor="#f7f7f7">
<td width="12%" height="30" align="right" bgcolor="#FFFFFF">年级库:</td>
<td width="87%" height="30" bgcolor="#FFFFFF">
<input type="checkbox" name="NJid" value="小学" id="jibie1" >
小学
<input type="checkbox" name="NJid" value="初中" id="jibie2">
初中
<input type="checkbox" name="NJid" value="高中" id="jibie3">
高中 </td>
</tr>
<tr bgcolor="#f7f7f7">
<td width="12%" height="30" align="right" bgcolor="#FFFFFF">科目库:</td>
<td width="87%" height="30" bgcolor="#FFFFFF"><input type="checkbox" name="KMid" value="语文" id="kemu1">
语文
<input type="checkbox" name="KMid" value="数学" id="kemu2">
数学
<input type="checkbox" name="KMid" value="英语" id="kemu3">
英语</td>
</tr>
</table>
<table width="100%" id="table2" border="1" cellpadding="2" bordercolor="blue" style="border-collapse:collapse">
</table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
//级别选择框
$("#table1 tr:eq(0) td input:checkbox").click(function(){
if(this.checked==true){
var trID = "tr_"+$(this).attr("id"); //行id
//新增行,注意行id
$("#table2").append("<tr id='"+trID+"'><td>"+$(this).val()+":<input type='text' name='jibie_val' value='"+trID+"' /> </td><td></td></tr>");
//新增级别行前, 如果有些科目已选择,则要添加
var $checkd = $("#table1 tr:eq(1) td input:checkbox:checked"); //获取已选择的科目
if($checkd.length>0){ //如果有科目被选中,循环加到第二个单元格
$checkd.each(function(){
$("#table2 #"+trID+" td:odd").append("<div class='div_"+$(this).attr("id")+"'>"+$(this).val()+":<input type='text' name='"+$(this).attr("id")+"'/>["+trID+"]</div>");
});
}
}
else{
$("#table2 #tr_"+$(this).attr("id")).remove();}
});
//科目选择框
$("#table1 tr:eq(1) td input:checkbox").click(function(){
if($("#table2 tr").length>0){ //只有级别有一个或以上被选择,才可以选择科目
if(this.checked==true){
$("#table2 tr td:odd").append("<div class='div_"+$(this).attr("id")+"'>"+$(this).val()+":<input type='text' name='"+$(this).attr("id")+"'/>[<font color='#FF0000'>这里也要获得trID的值</font>]</div>");
}
else{
$("#table2 tr td:odd").find(".div_"+$(this).attr("id")).remove();
}
}
else{
this.checked=false;
}
});
})
</script>
</head>
<body>
<table class="tableBorder" width="100%" border="0" cellspacing="1" bgcolor="#eff0eb" id="table1">
<tr bgcolor="#f7f7f7">
<td width="12%" height="30" align="right" bgcolor="#FFFFFF">年级库:</td>
<td width="87%" height="30" bgcolor="#FFFFFF">
<input type="checkbox" name="NJid" value="小学" id="jibie1" >
小学
<input type="checkbox" name="NJid" value="初中" id="jibie2">
初中
<input type="checkbox" name="NJid" value="高中" id="jibie3">
高中 </td>
</tr>
<tr bgcolor="#f7f7f7">
<td width="12%" height="30" align="right" bgcolor="#FFFFFF">科目库:</td>
<td width="87%" height="30" bgcolor="#FFFFFF"><input type="checkbox" name="KMid" value="语文" id="kemu1">
语文
<input type="checkbox" name="KMid" value="数学" id="kemu2">
数学
<input type="checkbox" name="KMid" value="英语" id="kemu3">
英语</td>
</tr>
</table>
<table width="100%" id="table2" border="1" cellpadding="2" bordercolor="blue" style="border-collapse:collapse">
</table>
</body>
</html>
解决方案 »
- jQuery在ajax的回調方法中如何解析json數組
- textContent和innerText有所不同 如何解决
- 还是如何让A标签不可点击的问题,刚没描述清楚...在线等。。。
- js中获得cookie中的值
- dojo跨域访问获取数据的问题
- 请问用javascript写的网页怎么从源码里看到时间?
- 急急急!!!关于网页框架中的下拉菜单的问题?
- http://61.174.260.86/top.html*6,1,1 星号后面是什么东西?作什么用的?
- 怎样删除HTML的空标签,例如<span></span>
- 请问 href="javascript:playAudio('2001/08/10/EPSL_2001-08-10_13.wav')" 是什么意思?
- 求解 js出现 WebCalendar.iframe.tableWeek is undefined ,在线等解决~@
- button元素的id与onclick要调用的函数名字相同
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
//级别选择框
$("#table1 tr:eq(0) td input:checkbox").click(function(){
if(this.checked==true){
var trID = "tr_"+$(this).attr("id"); //行id
//新增行,注意行id
$("#table2").append("<tr id='"+trID+"'><td>"+$(this).val()+":<input type='text' name='jibie_val' value='"+trID+"' /> </td><td></td></tr>");
//新增级别行前, 如果有些科目已选择,则要添加
var $checkd = $("#table1 tr:eq(1) td input:checkbox:checked"); //获取已选择的科目
if($checkd.length>0){ //如果有科目被选中,循环加到第二个单元格
$checkd.each(function(){
$("#table2 #"+trID+" td:odd").append("<div class='div_"+$(this).attr("id")+"'>"+$(this).val()+":<input type='text' name='"+$(this).attr("id")+"'/>["+trID+"]</div>");
});
}
}
else{
$("#table2 #tr_"+$(this).attr("id")).remove();}
});
//科目选择框
$("#table1 tr:eq(1) td input:checkbox").click(function(){
if($("#table2 tr").length>0){ //只有级别有一个或以上被选择,才可以选择科目
if(this.checked==true){
//
var trID = $(this).attr('id');
$("#table2 tr td:odd").append("<div class='div_"+$(this).attr("id")+"'>"+$(this).val()+":<input type='text' name='"+$(this).attr("id")+"'/>[<font color='#FF0000'>"+trID+"</font>]</div>");
}
else{
$("#table2 tr td:odd").find(".div_"+$(this).attr("id")).remove();
}
}
else{
this.checked=false;
}
});
})
</script>
</head>
<body>
<table class="tableBorder" width="100%" border="0" cellspacing="1" bgcolor="#eff0eb" id="table1">
<tr bgcolor="#f7f7f7">
<td width="12%" height="30" align="right" bgcolor="#FFFFFF">年级库:</td>
<td width="87%" height="30" bgcolor="#FFFFFF">
<input type="checkbox" name="NJid" value="小学" id="jibie1" >
小学
<input type="checkbox" name="NJid" value="初中" id="jibie2">
初中
<input type="checkbox" name="NJid" value="高中" id="jibie3">
高中 </td>
</tr>
<tr bgcolor="#f7f7f7">
<td width="12%" height="30" align="right" bgcolor="#FFFFFF">科目库:</td>
<td width="87%" height="30" bgcolor="#FFFFFF"><input type="checkbox" name="KMid" value="语文" id="kemu1">
语文
<input type="checkbox" name="KMid" value="数学" id="kemu2">
数学
<input type="checkbox" name="KMid" value="英语" id="kemu3">
英语</td>
</tr>
</table>
<table width="100%" id="table2" border="1" cellpadding="2" bordercolor="blue" style="border-collapse:collapse">
</table>
</body>
</html>
不是的。例如现在点击小学,然后再选择语文,这样下面会出现小学和语文的字样,语文旁边不是有个红色字“[这里也要获得trID的值]”的吗。
你再点击下初中,同时会出现初中和语文,但语文旁边附带的是初中的VALUE,我想要的是刚才红色字那里也是显示小学的VALUE
你先看看是不是像这样的效果。。