提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  后端

当前栏目

ASP.NET中用js取CheckBoxList中值的方法实例

NetJS实例ASP方法 中用 中值 checkboxlist
2023-06-13 09:15:03 时间

做的一些项目都比较小，而且时间紧，有好多东西都没来得急总结，趁这会还有点时间把前面项目中的用到的知识点分享下，只为以后方便使用。
前台页面代码

复制代码代码如下:

<!--关键字-->
   <divid="keyWordsDiv"style="border:2pxsolid#6FA1D9;display:none;position:absolute;
       top:0px;left:0px;width:260px;height:120px;z-index:3;background-color:#EAF1FD;">
       <divstyle="width:260px;height:20px;background-color:#6FA1D9">
           <ulstyle="cursor:pointer;line-height:20px;">
               <listyle="float:right"onclick="getCheckVale()">[确定]</li><listyle="float:right"
                   onclick="closeSelf()">[关闭]</li></ul>
       </div>
       <div>
           <asp:CheckBoxListID="cblKeyWords"runat="server"RepeatColumns="2">
           </asp:CheckBoxList>
       </div>
   </div>

js脚本
复制代码代码如下:

//打开关键词窗口
function locking(e)
{     
   vardivLeft=e.offsetLeft;
   vardivTop=e.offsetTop;
   while(e=e.offsetParent) 
   { 
        divLeft  +=  e.offsetLeft;   
        divTop  +=  e.offsetTop; 
   }     
   vardivObj=document.getElementById("keyWordsDiv");  
   divObj.style.left=divLeft+"px";
   divObj.style.top=divTop+20+"px";
   divObj.style.display="block"; 
}
//关闭关键词窗口
function closeSelf()
{
   document.all.keyWordsDiv.style.display="none";
   varobjCheck=document.getElementById("cblKeyWords").getElementsByTagName("input");
   for(vari=0;i<objCheck.length;i++){
       document.getElementById("cblKeyWords_"+i).checked=false;
   }
   returnfalse;    
}
//关键词取值
functiongetCheckVale()
{
//varobjCheck=document.getElementById("cblKeyWords");
varobjCheck=document.getElementById("cblKeyWords").getElementsByTagName("input");
varobjLabel=document.getElementById("cblKeyWords").getElementsByTagName("label")
vartxtKeyWordsValue="";
varm=0
for(vari=0;i<objCheck.length;i++)
{
     if(document.getElementById("cblKeyWords_"+i).checked)
     {
       varidCheck=document.getElementById("cblKeyWords_"+i).id;//当前选择checkbox的ID
       for(varj=0;j<objLabel.length;j++)
       {
           varforvalue=objLabel[j].getAttributeNode("for").value             
           if(forvalue==idCheck)
           { 
              m+=1;
              for(vark=0;k<m;k++)
              {
              if(k==m-1)
              {
                   txtKeyWordsValue+=objLabel[j].innerHTML;
              }
              else
              {
                   txtKeyWordsValue+="|"+objLabel[j].innerHTML;
                   break;
               }
               }
           }
       }
     }    
}
document.getElementById("txtKeyWords").value=txtKeyWordsValue;
document.all.keyWordsDiv.style.display="none";
}

添加一个按钮调用js
复制代码代码如下:
<asp:TextBoxID="txtKeyWords"runat="server"ReadOnly="True"class="inp"></asp:TextBox>
<inputid="imgkey"type="button"runat="server"onclick="locking(this)"class="tailBut" value="选择"/>

 好了，代码就这么多，点击按钮后弹出层，选中复选框后确实就可以取到值了，下面来看下效果吧！

相关文章