复选框选择即时传值的问题？

<html>
<head>
<script language="javascript" type="text/javascript">
var arr = [];
var noCheckHTML = "< 未选择 >"function init()
{//load初始化事件
    with(document.getElementById("selectedPlayerID"))
    {
        innerHTML = noCheckHTML;
    }
    var chk =document.getElementsByName("type[]");
    for(var i=0;i<chk.length;i++)
    {
        chk[i].checked = false;
        chk[i].onclick=new Function("chkClick(this.checked,this.title)")
    }

}
Array.prototype.contains = function(o)
{ //判断数组arr中是否含有元素o
      var flag = false;
      for(var i=0;i<this.length;i++)
      {
         if(this[i]==o)
         {
            flag = true;
            break;
         }

      }
      return flag;
}
function chkClick(_isChecked,_title)
{
    _isChecked?arr.push(_title):arr.pop(_title);
    with(document.getElementById("selectedPlayerID"))
    {
        arr.length>0?innerHTML = "< "+arr.toString()+" >":innerHTML = noCheckHTML;
    }
}
</script>
</head>
<body onload="init()">
<form ACTION="" name="form1" >
<table >
   <tr >
      <td >
       <input type="checkbox" name="type[]" value="1" title="类别一"> 类别一
       <input type="checkbox" name="type[]" value="2" title="类别二"> 类别二
       <input type="checkbox" name="type[]" value="3" title="类别三"> 类别三
      <td >
    </tr >
   <tr >
      <td >
       <span id="selectedPlayerID" >< 未选择 > </span >
      <td >
    </tr >
</table >
</form >
</body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<html>
<head>
<script language="javascript" type="text/javascript">
var arr = [];
var noCheckHTML = "< 未选择 >"function init()
{//load初始化事件
    with(document.getElementById("selectedPlayerID"))
    {
        innerHTML = noCheckHTML;
    }
    var chk =document.getElementsByName("type[]");
    for(var i=0;i<chk.length;i++)
    {
        chk[i].checked = false;
        chk[i].onclick=new Function("chkClick(this.checked,this.title)")
    }}Array.prototype.contains = function(o)
{ //判断数组arr中是否含有元素,有返回index,没有返回-1
      var index = -1;
      for(var i=0;i<this.length;i++)
      {
         if(this[i]==o)
         {
            index = i;
            break;
         }
      }
      return index;
}Array.prototype.remove = function(o)
{ //判断数组arr中是否含有元素o
    var index;
    var t = this;
    if((index=this.contains(o))!=-1)
    {
        t= t.slice(0,index).concat(t.slice(index+1,t.length));
    }

    return t;
}
function chkClick(_isChecked,_title)
{
    _isChecked?arr.push(_title):arr = arr.remove(_title);
    with(document.getElementById("selectedPlayerID"))
    {
        arr.length>0?innerHTML = "< "+arr.toString()+" >":innerHTML = noCheckHTML;
    }
}
</script>
</head>
<body onload="init()">
<form ACTION="" name="form1" >
<table >
   <tr >
      <td >
       <input type="checkbox" name="type[]" value="1" title="类别一"> 类别一
       <input type="checkbox" name="type[]" value="2" title="类别二"> 类别二
       <input type="checkbox" name="type[]" value="3" title="类别三"> 类别三
      <td >
    </tr >
   <tr >
      <td >
       <span id="selectedPlayerID" >< 未选择 > </span >
      <td >
    </tr >
</table >
</form >
</body>
</html>
搞了半年CS项目,现在重新学习javascript
上面数组remove元素方法可以再优化一下，唉，直接用splice就ok了
Array.prototype.remove = function(o)
{ //判断数组arr中是否含有元素o
    var index;
    if((index=this.contains(o))!=-1)
    {
        this.splice(index,1);
    }

    return this;
}相应代码改成
<html>
<head>
<script language="javascript" type="text/javascript">
var arr = [];
var noCheckHTML = "< 未选择 >"function init()
{//load初始化事件
    with(document.getElementById("selectedPlayerID"))
    {
        innerHTML = noCheckHTML;
    }
    var chk =document.getElementsByName("type[]");
    for(var i=0;i<chk.length;i++)
    {
        chk[i].checked = false;
        chk[i].onclick=new Function("chkClick(this.checked,this.title)")
    }
}Array.prototype.contains = function(o)
{ //判断数组arr中是否含有元素,有返回index,没有返回-1
      var index = -1;
      for(var i=0;i<this.length;i++)
      {
         if(this[i]==o)
         {
            index = i;
            break;
         }
      }
      return index;
}Array.prototype.remove = function(o)
{ //判断数组arr中删除元素o
    var index;
    if((index=this.contains(o))!=-1)
    {
        this.splice(index,1);
    }

    return this;
}
function chkClick(_isChecked,_title)
{//checkbox单击事件
    _isChecked?arr.push(_title):arr.remove(_title);
    with(document.getElementById("selectedPlayerID"))
    {
        arr.length>0?innerHTML = "< "+arr.toString()+" >":innerHTML = noCheckHTML;
    }
}
</script>
</head>
<body onload="init()">
<form ACTION="" name="form1" >
<table >
   <tr >
      <td >
       <input type="checkbox" name="type[]" value="1" title="类别一"> 类别一
       <input type="checkbox" name="type[]" value="2" title="类别二"> 类别二
       <input type="checkbox" name="type[]" value="3" title="类别三"> 类别三
      <td >
    </tr >
   <tr >
      <td >
       <span id="selectedPlayerID" >< 未选择 > </span >
      <td >
    </tr >
</table >
</form >
</body>
</html>
<html>
<script>
function initCheckBox(){
    var cbs=document.getElementsByName("type[]");
    for(var i=0;i<cbs.length;i++)
    {
        cbs[i].onclick=chkClick;
    }
}
function chkClick(){
    var str="<";
    var cbs=document.getElementsByName("type[]");
    for(var i=0;i<cbs.length;i++)
    {
        if(cbs[i].checked)str+=cbs[i].title+",";
    }
    if(/,$/.test(str)){
        str=str.replace(/,$/,">");
    }else{
        str="<未选择>";
    }
    document.getElementById("selectedPlayerID").innerHTML=str;
}
</script>
<body onload="initCheckBox();chkClick()">
<form ACTION="" name="form1">
<table>
   <tr>
      <td>
       <input type="checkbox" name="type[]" value="1" title="类别一" /> 类别一
       <input type="checkbox" name="type[]" value="2" title="类别二" /> 类别二
       <input type="checkbox" name="type[]" value="3" title="类别三" /> 类别三
      <td>
    </tr>
   <tr>
      <td>
       <span id="selectedPlayerID" ><未选择> </span >
      <td>
    </tr>
</table>
</form>
</body>
</html>
<HTML>
<HEAD>
  <TITLE> CheckBox</TITLE>
</HEAD>
<script language="javascript">
function clickTest(obj){
var myatr = document.getElementsByTagName("input");
document.getElementById("mydiv").innerHTML="";
for(var i=0;i<myatr.length;i++){
if(myatr[i].checked){
document.getElementById("mydiv").innerHTML+=myatr[i].value+"  ";
}
}
if(myatr[0].checked==false & myatr[1].checked==false & myatr[2].checked==false){
document.getElementById("mydiv").innerHTML="未选择";
}
}
</script>
<BODY>
<br> <hr/>
<center>
<br>
<table border="1" width="480" bordercolor="#8922cc">
<tr>
<td>
<input type="checkbox" name="test" value="1" onclick="clickTest(this);"/>按钮1<br>
<input type="checkbox" name="test" value="2" onclick="clickTest(this);"/>按钮2<br>
<input type="checkbox" name="test" value="3" onclick="clickTest(this);"/>按钮3
</td>
</tr>
<tr>
<td>
<dir id="mydiv">未选择</div>
</td>
</tr>
</table>
</center>
</BODY>
</HTML>