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>
  • 相关阅读:
    [USACO08JAN]牛大赛Cow Contest
    [USACO07NOV]牛栏Cow Hurdles
    [USACO09JAN]最好的地方Best Spot
    [USACO08OPEN]寻宝之路Clear And Present Danger
    [BZOJ 1146] [CTSC2008]网络管理Network(树状数组+主席树)
    bzoj4009: [HNOI2015]接水果(整体二分)
    【bzoj2141】排队 [国家集训队2011]排队(树套树)
    洛谷P4689 [Ynoi2016]这是我自己的发明(树上莫队+树链剖分)
    【bzoj3083】遥远的国度(树链剖分+线段树)
    CF311B Cats Transport(斜率优化)
  • 原文地址:https://www.cnblogs.com/ybbqg/p/2413357.html
Copyright © 2011-2022 走看看