本人菜鸟,网上搜了很多,感觉都不符合我的需求,特来此发帖求助。
有一个table,table中每行有2个checkbox列,其他列都是些基本信息,包括学生姓名,学生成绩等等。
要求选中某行的一个checkbox,可以得到该行其他列的数据,如该行的学生姓名,学生成绩等等,同时该行的另外一个checkbox要不选中。
有一个table,table中每行有2个checkbox列,其他列都是些基本信息,包括学生姓名,学生成绩等等。
要求选中某行的一个checkbox,可以得到该行其他列的数据,如该行的学生姓名,学生成绩等等,同时该行的另外一个checkbox要不选中。
<table>
<tr>
<td>学生姓名</td>
<td>学生成绩</td>
<td>有效<input type="checkbox" id="yesheader" /></td>
<td>无效<input type="checkbox" id="noheader" /></td>
</tr>
<tr>
<td>王</td>
<td>80</td>
<td><input type="checkbox" value="0" name="yes_1" /></td>
<td><input type="checkbox" value="1" name="no_1" /></td>
</tr>
<tr>
<td>张</td>
<td>90</td>
<td><input type="checkbox" value="0" disabled="true" name="yes_2"/></td>
<td><input type="checkbox" value="1" name="no_2" /></td>
</tr>
<tr>
<td>李</td>
<td>80</td>
<td><input type="checkbox" value="0" name="yes_3"/></td>
<td><input type="checkbox" value="1" name="no_3" /></td>
</tr>
</table>
$(function () {
$("[type=checkbox]").on("click",function () {
var $this= $(this), that= this;
var checked = $this.prop("checked");
var tr= $this.parents("tr")[0];
$("[type=checkbox]",tr).each(function(){
if(this != that){
$(this).prop("checked", !checked);
}
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$("#abv").click(function(){
$("table tr td input[type='checkbox']:checked").each(function(i,j){
var ar=new Array();
ar.push($(this).parents('tr').children('td').eq(0).text(),$(this).parents('tr').children('td').eq(1).text());
alert(ar);
});
});
});
</script>
<input type="button" id="abv" value="测试用按钮"/>
<table>
<tr>
<td>学生姓名</td>
<td>学生成绩</td>
<td>有效<input type="checkbox" id="yesheader" /></td>
<td>无效<input type="checkbox" id="noheader" /></td>
</tr>
<tr>
<td>王</td>
<td>80</td>
<td><input type="checkbox" value="0" name="yes_1" /></td>
<td><input type="checkbox" value="1" name="no_1" /></td>
</tr>
<tr>
<td>张</td>
<td>90</td>
<td><input type="checkbox" value="0" disabled="true" name="yes_2"/></td>
<td><input type="checkbox" value="1" name="no_2" /></td>
</tr>
<tr>
<td>李</td>
<td>80</td>
<td><input type="checkbox" value="0" name="yes_3"/></td>
<td><input type="checkbox" value="1" name="no_3" /></td>
</tr>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$("#abv").click(function(){
$("table tr td input[type='checkbox']:checked").each(function(i,j){
var ar=new Array();
ar.push($(this).parents('tr').children('td').eq(0).text(),$(this).parents('tr').children('td').eq(1).text());
alert(ar);
});
});
$("table tr td input[type='checkbox']").click(function(){
$(this).parents('tr').children('td').find('input').not(this).attr("checked",false);
});
});
</script>