<div class="Search_control_body_Big_Pop2_wrod_from"><div class="from_P0p2"></div>
<div class="Search_control_body_Big_Pop2_wrod_checkbox_from">
<div class="Search_control_body_Big_Pop2_wrod_checkbox"><input type="checkbox" /></div>
<div class="Search_control_body_Big_Pop2_wrod_word_word">A</div>
</div> </div>
<div class="Search_control_body_Big_Pop2_wrod_from"><div class="from_P0p2"></div>
<div class="Search_control_body_Big_Pop2_wrod_checkbox_from">
<div class="Search_control_body_Big_Pop2_wrod_checkbox"><input type="checkbox" /></div>
<div class="Search_control_body_Big_Pop2_wrod_word_word2">B</div>
</div> </div>
<div class="Search_control_body_Big_Pop2_wrod_from"><div class="from_P0p2"></div>
<div class="Search_control_body_Big_Pop2_wrod_checkbox_from">
<div class="Search_control_body_Big_Pop2_wrod_checkbox"><input type="checkbox" /></div>
<div class="Search_control_body_Big_Pop2_wrod_word_word3">C</div>
</div> </div>
<div class="Search_control_body_Big_border_from_right">
<div class="Search_control_body_Big_border_Search_right" id="text1">塔顶塔顶 </div>
</div>图大概是这个样子的，，我想问如何判断点击了哪一个checkbox，并且点击的那个checkbox显示到塔顶塔顶那个文本框里，如果点击2个以上的checkbox的时候，那个文本框只显示第一个点击的checkbox的元素，但是这个元素的前面要显示剩余点击的checkbox的数目！
不知道我说的明不明白，请高人求助呀！！
<!doctype html>
<html>
<head>
<meta charset="gb2312" />
<style>
</style>
</head>
<body>
剩余：<span id="sy"></span><br />
选择：<span id="xz"></span><br />
A<input type="checkbox" name="test" value="A" />
B<input type="checkbox" name="test" value="B" />
C<input type="checkbox" name="test" value="C" />
D<input type="checkbox" name="test" value="D" />
<script>
function $(o){return document.getElementById(o)}
var obj = document.getElementsByName('test');
var temp;
for(var i = 0, len = obj.length; i < len; i++){
(function(i){
obj[i].onclick = function(){
var count = 0;
for(var i = 0, len = obj.length; i < len; i++){
if(obj[i].checked){
count++;
}
}
if(!temp){
$('xz').innerHTML = this.value;
temp = 1;
}
$('sy').innerHTML = len - count;
}
})(i)
}
</script>
</body>
</html>楼主这个意思？
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<style>
</style>
</head>
<body>
剩余：<span id="sy"></span><br />
选择：<span id="xz"></span><br />
A<input type="checkbox" name="test" value="A" />
B<input type="checkbox" name="test" value="B" />
C<input type="checkbox" name="test" value="C" />
D<input type="checkbox" name="test" value="D" />
<input type="button" id="show" value="查看" onclick="show()"/>
<script>
function show(){
var obj = document.getElementsByName('test');
var count=0;var j=0;var flag=1;
for(var i = 0; i < obj.length; i++){
if(obj[i].checked){ count++;
if(flag){j=i;flag=0;}}
}
document.getElementById('xz').innerHTML=obj[j].value;
document.getElementById('sy').innerHTML=obj.length-count;
}
</script>
</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=utf-8" />
<title>Check Box</title>
</head><body>
<div id="select">OOXX</div>
<div id="option">
<div class="subs">
<input type="checkbox" id="check-a" /><label for="check-a">A</label>
</div>
<div class="subs">
<input type="checkbox" id="check-b" /><label for="check-b">B</label>
</div>
<div class="subs">
<input type="checkbox" id="check-c" /><label for="check-c">C</label>
</div>
</div>
</body>
<script type="text/javascript">
function changeValue(){
var box = document.getElementsByTagName('input'),
label = document.getElementsByTagName('label'),
target = document.getElementById('select'),
str = '';
for (var i=0;i<box.length;i++){
box[i].onchange = function(){
for (var j=0;j<label.length;j++){
if(this.id == label[j].getAttribute('for'))
{
str += label[j].innerHTML;
target.innerHTML = str;
}
}
};
};
};
changeValue();
</script>
</html>改得不全，但是应该算是提示吧！