zoukankan      html  css  js  c++  java
  • jquery对表单checkbox复选框的操作例子(全选,反选,获取选取值)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link href="css/ingrid.css" rel="stylesheet" type="text/css">
    <script language="JavaScript" src="jquery.js" type="text/javascript"></script>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    $(
    "document").ready(function(){
    $(
    "#btn1").click(function(){
    $(
    "[name='checkbox']").attr("checked",'true');//全选
    })
    $(
    "#btn2").click(function(){
    $(
    "[name='checkbox']").removeAttr("checked");//取消全选
    })
    $(
    "#btn3").click(function(){
    $(
    "[name='checkbox']:even").attr("checked",'true');//选中所有奇数
    })
    $(
    "#btn4").click(function(){
    $(
    "[name='checkbox']").each(function(){
    if($(this).attr("checked")) {
    $(
    this).removeAttr("checked");
    }
    else {
    $(
    this).attr("checked",'true');
    }
    })
    })
    $(
    "#btn5").click(function(){
    var str="";
    $(
    "[name='checkbox'][checked]").each(function(){
    str
    +=$(this).val()+"\r\n";
    })
    alert(str);
    })
    })
    //-->
    </SCRIPT>
    </HEAD>
    <BODY>
    <form name="form1" method="post" action="">
    <input type="button" id="btn1" value="全选">
    <input type="button" id="btn2" value="取消全选">
    <input type="button" id="btn3" value="选中所有奇数">
    <input type="button" id="btn4" value="反选">
    <input type="button" id="btn5" value="获得选中的所有值">
    <br>
    <input type="checkbox" name="checkbox" value="checkbox1">
    checkbox1
    <input type="checkbox" name="checkbox" value="checkbox2">
    checkbox2
    <input type="checkbox" name="checkbox" value="checkbox3">
    checkbox3
    <input type="checkbox" name="checkbox" value="checkbox4">
    checkbox4
    <input type="checkbox" name="checkbox" value="checkbox5">
    checkbox5
    <input type="checkbox" name="checkbox" value="checkbox6">
    checkbox6
    <input type="checkbox" name="checkbox" value="checkbox7">
    checkbox7
    <input type="checkbox" name="checkbox" value="checkbox8">
    checkbox8
    </form>
    </BODY>
    </HTML>
  • 相关阅读:
    3D集合图元:最小边界框/包围盒(boundingbox)
    vs2012下 error4996
    将自己的类封装为lib的方法
    3D特征:关于HFM和HBB
    C++的Matlab接口
    BigDataMini导论
    vs2012编译boost_1_54_0
    RGB_D_开发征程(使用Kinect)
    **PCD数据获取:Kinect+OpenNI+PCL对接(代码)
    PCL:全程详解 VS2010+PCL配置
  • 原文地址:https://www.cnblogs.com/ybbqg/p/2413357.html
Copyright © 2011-2022 走看看