给每个checkbox 加 onclick 事件,查询当前选中的个数,如果已到 5 项,则取消

解决方案 »

  1.   

    要根据你的怎么个无法刷新联动具体实现,熟悉 js 的化,纯粹小 case
      

  2.   

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="ChArea.aspx.cs" Inherits="Personal_ChArea" %><!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 id="Head1" runat="server">
        <title>无标题页</title>
        <base target="_self" />
        <link href="css/bjan.css" rel="stylesheet" type="text/css" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">
    <!--
    body {
    background-color: #efefef;
    }
    -->
    </style>
    <script language="javascript" type="text/javascript">
    function Submit1_onclick() {}        function load(MC_ID)
            {
                    var  check  =  document.createElement("input");  
                    check.type=  "checkbox";  
                    check.value=  "1  ";  
       
                var oHttpReq = new ActiveXObject("MSXML2.XMLHTTP");
                var oDoc = new ActiveXObject("Microsoft.XMLDOM");
                oHttpReq.open("POST", "DropChild.aspx?ClassID="+MC_ID, false);
                //alert(MC_ID);
                oHttpReq.send("");
          
                result = oHttpReq.responseText;
        
                oDoc.loadXML(result);
                items1 = oDoc.selectNodes("//Table/MC_Name"); 
                items2 = oDoc.selectNodes("//Table/MC_ID"); 
                       
                var itemsLength=items1.length;
                var  list  =  document.getElementById("ckSubClass");  
                list.children[0].removeNode(true); 
                var  row  =  list.insertRow();              for(i=0;i<itemsLength;i++)                                                                
                {
                    if  (i >  0  &&  i  %  4  ==  0)  
                    {  
                       row  =  list.insertRow();  
                    }  
                    var check = document.createElement("input");
                    check.type="checkbox";
            
                    check.value=items2[i].text;
                    var cell=row.insertCell();
          
                    cell.appendChild(check);
             
                    var label = document.createElement("span");                  
                    label.innerHTML = items1[i].text;
                    cell.appendChild(label);
                }           
          }// -->
    </script>
    </head>
    <body>
        <form id="form1" runat="server"><br />    <table width="96%" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td height="25" bgcolor="#FFFFFF"> &nbsp;&nbsp;&nbsp;<span class="bigbiaoti">请选择求职区域</span></td>
      </tr>
      <tr>
        <td bgcolor="#FFFFFF"><div>&nbsp;
            <asp:DropDownList ID="ddlMainClass" runat="server" Width="159px">        
            </asp:DropDownList><asp:Label ID="lblNum" Text="" runat="server" ></asp:Label><br />
            <br />
            <asp:CheckBoxList ID="ckSubClass" runat="server" RepeatColumns="4" RepeatDirection="Horizontal"
                Width="644px" AutoPostBack="True" OnSelectedIndexChanged="ckSubClass_SelectedIndexChanged"> <asp:ListItem  Text=  "test1  "  Value=  "0  "  >  </asp:ListItem  >  
    </asp:CheckBoxList>
            &nbsp;</div></td>
      </tr>
      <tr>
        <td bgcolor="#FFFFFF" style="height: 55px"><table width="98%" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td bgcolor="#EFEFEF" style="padding-left:20px; padding-bottom:20px; padding-right:20px; padding-top:20px;"><asp:Label ID="lblJobType" Text="" runat="server" ></asp:Label></td>
      </tr>
    </table>
    </td>
      </tr>
      <tr>
        <td height="35" align="right" bgcolor="#FFFFFF"><input type="submit" name="Submit2" value="确定" id="Submit1" language="javascript" onclick="return Submit1_onclick()" />
          &nbsp;&nbsp;&nbsp;
          <input type="button" name="Submit" value="关闭"  onclick="javascript:window.close();"/>
          &nbsp;&nbsp;&nbsp;&nbsp;</td>
      </tr>
    </table>    </form>
    </body>
    </html>
    后台:
    =================================================================================
    using System;
    using System.Data;
    using System.Configuration;
    using System.Collections;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;
    using System.Web.SessionState;public partial class Personal_ChArea : System.Web.UI.Page
    {
        //string strTemp = string.Empty;
       
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!this.Page.IsPostBack)
            {
                ddlProvinceLoad();
                ddlCityLoad();
            }
            //ckSubClass.SelectedIndexChanged += new System.EventHandler(this.ckSubClass_SelectedIndexChanged);
            //ckSubClass.AutoPostBack = true; 
        }    protected void ddlProvinceLoad()
        {
            Business.ComGetData bc = new Business.ComGetData();
            
            DataTable dt = bc.Province();        this.ddlMainClass.DataSource = dt.DefaultView;
            this.ddlMainClass.DataTextField = "MC_Name";
            this.ddlMainClass.DataValueField = "MC_ID";
            this.ddlMainClass.DataBind();
            this.ddlMainClass.Attributes.Add("onchange", "load(this.options[this.selectedIndex].value)");     }    protected void ddlCityLoad()
        {
            Business.ComGetData bc = new Business.ComGetData();        bc.Commond = this.ddlMainClass.SelectedItem.Text.ToString();        this.ckSubClass.DataSource = bc.CommonInfo().Tables[0].DefaultView;
            this.ckSubClass.DataTextField = "MC_Name";
            this.ckSubClass.DataValueField = "MC_ID";
            this.ckSubClass.DataBind();
        }    protected void ckSubClass_SelectedIndexChanged(object sender, EventArgs e)
        {
            string s = string.Empty;
            if (Session["Temp"] != null)
            {
                lblJobType.Text = Session["Temp"].ToString();
            }
            int k = 0;
            //s = "";
            for (int i = 0; i < ckSubClass.Items.Count; i++)
            {
                if (ckSubClass.Items[i].Selected)
                {
                    if (s == "")
                    {
                        s = ckSubClass.Items[i].Text;
                    }
                    else
                    {
                        s = s + " , " + ckSubClass.Items[i].Text;        
                    }
                    //lblJobType.Text = ckSubClass.Items[i].Text + " , ";
                   k = i;
                }
            }        int nCount = 0;
            for (int j = 0; j < s.Length; j++)
            {
                if (s[j].ToString() == ",")
                {
                    nCount++;
                }
            }        if (nCount > 4)
            {
                //Response.Write("哈哈哈哈");  
                Response.Write("<script language=javascript>alert('最多选择5个地区!');</script>");
                ckSubClass.Items[k].Selected = false;
                return;
            }
            //if (Session["Temp"] == null)
            //{
                Session["Temp"] = s;
            //}
            //else
            //{
            //    Session["Temp"] += s;
            //}        lblJobType.Text = s;            
        }
    }
      

  3.   

    Jinglecat(晓风残月 >> 问题需简洁,错误要详细)   怎么无刷新联动了还要要刷新一次哦?  ---------------------------------------------------------------------------
    实现DropDownList与CheckBoxList联动的时候是无刷新的!
    在选择CheckBox时刷新了!
      

  4.   

    CheckBoxList的AutoPostBack = false   name="checkboxlist"
    把判断教给前台javascript
    function maxchk(obj)
    {
      var txt=document.getElementById("textboxid");//用来显示选择信息的textbox
      var arr=document.getElementByName("checkboxlist");//取出checkbox集合
      var num=0;
      for(var i=0;i<arr.length;i++)
      {
        if(arr[i].checked)
        {
          num=num+1;
        }
      }
      if(num>5)
      {
        应该不用写了吧。
      }
    }
      

  5.   

    选择CheckBox时刷新了?你是用了AJAX的无刷新技术吗?
      

  6.   

    belldandy11(数据库基础知识学习进行中……) 
     
       下班了 晚上有空再写写玩---------------------------------------------------------------------------
    谢谢~~~~=================================================================================
     qi_ting(奶牛)
     
     选择CheckBox时刷新了?你是用了AJAX的无刷新技术吗?
    --------------------------------------------------------------------------------
    选择CheckBox时用的 SelectedIndexChanged 在后台处理的,我想在Client处理,实现无刷新!
      
      

  7.   

    不好意思,上面有点说错了
    name="checkboxlist" 不用设
    页面上放个TextBox id="textbox1"
    function maxchk(obj)
    {
      var txt=document.getElementById("textbox1");
      var arr=document.all.tags("input");//取出checkbox集合
      var num=0;
      for(var i=0;i<arr.length;i++)
      {
        if(arr[i].type=="checkbox")//
        {
          if(arr[i].checked)
          {
            num=num+1;
            if(txt.value=="")
            {
               txt.innerText=arr[i].text;
             }
             else
             {
               txt.innerText+=","+arr[i].text;
             }
          }
        }
      }
      if(num>5)
      {
        window.alert("超过5个");
        obj.checked=false;
      }
    }
    每个checkbox的 onclick="maxchk(this)" 就可以了
      

  8.   

    谢谢belldandy11(数据库基础知识学习进行中……) 
    我试试
      

  9.   

    belldandy11(数据库基础知识学习进行中……)
       
    不好意思,上面有点说错了
    name="checkboxlist" 不用设
    页面上放个TextBox id="textbox1"
    function maxchk(obj)
    {
      var txt=document.getElementById("textbox1");
      var arr=document.all.tags("input");//取出checkbox集合
      var num=0;
      for(var i=0;i<arr.length;i++)
      {
        if(arr[i].type=="checkbox")//
        {
          if(arr[i].checked)
          {
            num=num+1;
            if(txt.value=="")
            {
               txt.innerText=arr[i].text;
             }
             else
             {
               txt.innerText+=","+arr[i].text;
             }
          }
        }
      }
      if(num>5)
      {
        window.alert("超过5个");
        obj.checked=false;
      }
    }
    每个checkbox的 onclick="maxchk(this)" 就可以了============================================================================有问题~
    显示的是这样~
    ,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined,undefined
      

  10.   

    arr[i].text
    换成 arr[i].value
    嘎嘎
    昨天下班赶时间,没测过-_-!
      

  11.   

    我在后台直接绑定数据时arr[i].value的值为on,而这样绑定数据时
         for(i=0;i<itemsLength;i++)                                                                
                {
                    if  (i >  0  &&  i  %  4  ==  0)  
                    {  
                       row  =  list.insertRow();  
                    }  
                    var check = document.createElement("input");
                    check.type="checkbox";
            
                    check.value=items2[i].text;
                    var cell=row.insertCell();
          
                    cell.appendChild(check);
             
                    var label = document.createElement("span");                  
                    label.innerHTML = items1[i].text;
                    cell.appendChild(label);
                }           
          }arr[i].value的值正常!
    已经选了五项,选第六项时,第六项的选中状态无法去掉!
      

  12.   

    txt.innerText+=  ",  "+arr[i].value;  
    每次的值不是加的一项的,而是将前面的项的值累加起来显示了!
    1244,1244,1245,1244,1245,1249,1244,1245,1249,1244,1245,1249,1253,1244,1245,1249,1250,1253,1244,1245,1246,1249,1250,1253
      

  13.   

    txt.innerText+=  ",  "+arr[i].value;  
    每次的值不是加的一项的,而是将前面的项的值累加起来显示了!
    1244,1244,1245,1244,1245,1249,1244,1245,1249,1244,1245,1249,1253,1244,1245,1249,1250,1253,1244,1245,1246,1249,1250,1253
    ==============================================
    看下你的生成页面的源码 onclick="maxchk(this)" 是加到什么地方了?
      

  14.   

    protected void Page_Load(object sender, EventArgs e)
        {
            if (!this.Page.IsPostBack)
            {
                ddlProvinceLoad();
                ddlCityLoad();
            }
            this.ckSubClass.Attributes.Add("OnClick", "maxchk(this)" );
        } 
      

  15.   

    这样的话
    你应该是加到了checkboxlist上了
    难怪了
    我再想想
      

  16.   

    belldandy11(数据库基础知识学习进行中……) 
     
    这样的话
    你应该是加到了checkboxlist上了
    难怪了
    我再想想==========================================
    谢谢~  
     
      

  17.   

    只能选择5项,好比我选择了北京下面的两项,再在上海下面选择四项那么此时我一共选择了6项,这时程序没有告诉我最多只能选5项~
    ================================================
    你的意思是不是,把选中的地区放到一个textbox里面,用逗号区分开,只能有5个对不对?
      

  18.   

    ajax我没用过,不清楚你为什么在checkboxlist上加onclick
    如果可以给每个checkbox加onclick事件
    还是给每个checkbox加onclick事件方便点
      

  19.   

    回复人:belldandy11(数据库基础知识学习进行中……)
     
      ajax我没用过,不清楚你为什么在checkboxlist上加onclick  
    如果可以给每个checkbox加onclick事件  
    还是给每个checkbox加onclick事件方便点  =========================================
    怎么给给每个checkbox加onclick事件  
    我用的就是checkboxlist~~~
      
      

  20.   

    javascript论坛才应该讨论的问题。
      

  21.   

    sp1234(与其赌博赚钱,不如自己开赌场)
     
      javascript论坛才应该讨论的问题。  ------------------------------------------------------------------------
    晕,原来我发错了地方???????????