zoukankan      html  css  js  c++  java
  • JQuery 获取checkbox被选中的值

    html代码
     <ulid="dxbox">
               <li><inputtype="checkbox" name="dns_area" id="chk1" value="jsdx"/><span>江苏电信</span></li>           
               <li><inputtype="checkbox" name="dns_area" id="chk1" value="yndx"/><span>云南电信</span></li>
               <li><inputtype="checkbox" name="dns_area"  value="gzdx"/><span>贵州电信</span></li>
               <li><inputtype="checkbox" name="dns_area"  value="bjdx"/><span>北京电信</span></li>
               <li><inputtype="checkbox" name="dns_area"  value="hendx"/><span>河南电信</span></li>
               <li><inputtype="checkbox" name="dns_area"  value="hndx"/><span>海南电信</span></li>
               <li><inputtype="checkbox" name="dns_area"  value="tjdx"/><span>天津电信</span></li>
               <li><inputtype="checkbox" name="dns_area"  value="lndx"/><span>辽宁电信</span></li>
      </ul>

    多选框另一种展现形式:
    <form action="" method="get">
         <label><input name="Fruit" type="checkbox" value="" checked="checked" />苹果 </label>
         <label><input name="Fruit" type="checkbox" value="" />桃子 </label>
         <label><input name="Fruit" type="checkbox" value="" />香蕉 </label>
         <label><input name="Fruit" type="checkbox" value="" />梨 </label>
    </form>

    方法1
    $("#dxbox li").each(function(){
       if($(this).find("input[type=checkbox]:checked").val()!= undefined)
       {
           alert($(this).find("input[type=checkbox]:checked").val());
       }
    });

    方法2
    $("#dxbox li input[type=checkbox]").each(function(){
       //var chk =$(this).find("[checked]");
       if(this.checked){
           alert($(this).val());
       }
    });  

    方法3 
    //此方法是获取所有选中的多选框
    $("#dxbox li input[type=checkbox]:checked").each(function(){
          alert($(this).val());
    });

     

  • 相关阅读:
    (参考)爬虫5-爬取中国大学排名情况
    005_软件安装之_常用办公软件
    004_软件安装之_Altium Designer
    001_基础硬件电路_二极管
    添加QQ群
    024_STM32程序移植之_ESP8266_TCP
    020_C语言常用函数
    004——转载C#禁止改变窗体大小
    003转载----C#打开网页
    002_Python基础学习网站
  • 原文地址:https://www.cnblogs.com/wind-wang/p/5643716.html
Copyright © 2011-2022 走看看