<!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>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>JQuery 判断checkbox是否选中，checkbox全选，获取checkbox选中值</title>

<script type="text/javascript" language="javascript" src="http://code.jquery.com/jquery-1.6.4.min.js" ></script>

<script type="text/javascript">

$(function(){

      /*------------

        全选/全不选

        ------------*/

     $('#cboxchecked').click(function(){

         //判断apple是否被选中

         var bischecked=$('#cboxchecked').is(':checked');

         var fruit=$('input[name="fruit"]');

         bischecked?fruit.attr('checked',true):fruit.attr('checked',false);

         });

         /*-------------

            获取选中值

          -------------*/

        $('#btn_submit').submit(function(){

            $('input[name="fruit"]:checked').each(function(){

                var sfruit=$(this).val();

                alert(sfruit);

                });

                return false;

            });

    })

</script>

</head>

<body>

<form action="">

  <input type="checkbox"  id="cboxchecked" />

  <label for="cboxchecked">全选/全不选</label>

  <br />

  <br />

  <input type="checkbox"  id="cboxapple" name="fruit" value="apple" />

  <label for="apple">Apple</label>

  <input type="checkbox"  id="cboxorange" name="fruit" value="orange" />

  <label for="orange">Orange</label>

  <input type="checkbox"  id="cboxbanana" name="fruit" value="banana" />

  <label for="banana">Banana</label>

  <input type="checkbox"  id="cboxgrapes" name="fruit" value="grapes" />

  <label for="grapes">Grapes</label>

  <br />

  <br />

  <input type="submit" id="btn_submit" value="submit" />

</form>

</body>

</html>

JQuery 判断checkbox是否选中，checkbox全选，获取checkbox选中值的更多相关文章

  1. jQuery实现checkbox（复选框）选中、全选反选代码

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  2. checkbox的选中、全选、返选、获取所有选中的值、所有的值、单选全部时父选中

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  3. jquery实现checkbox的单选和全选

    一.思路 全选:判断“全选”checkbox的状态,如果选中则把tbody下所有的checkbox选中,反之 单选:主要是判断有没有全选,如果不是选中状态就把全选的checkbox状态设置为false ...

  4. checkbox的全选，取消全选，获得选中值

    <html> <head> <title>jq全选以及获得选中项的值</title> <meta charset="utf-8" ...

  5. Android开发CheckBox控件，全选，反选，取消全选

    在Android开发中我们经常会使用CheckBox控件,那么怎么实现CheckBox控件的全选,反选呢 首先布局我们的界面: <?xml version="1.0" enc ...

  6. 扩展支持全选的CheckBox列。

    扩展支持全选的CheckBox列. https://www.codeproject.com/articles/42437/toggling-the-states-of-all-checkboxes-i ...

  7. Web网页树形列表中实现选中父节点则子节点全选和不选中父则子全不选

                需要实现的功能:选中父节点对应子节点全选:不选中父节点,对应子节点也不选中 如下图所示,选中车队,对应车队中车辆也全部选中,以实现车队中所有车辆在地图上的显示. 选中cqupt ...

  8. jQuery入门简单实现反选与全选

    //html代码<input type="checkbox" id= 'all' value="全选"> 选择全部 一键上路 <input t ...

  9. 2016/3/31 ①全选时 下面选项全选中 ② 下面不选中时 全选取消 ③在“” 中 转义字符的使用\ onclick=\"Checkpa(this,'flall')\"; ④区别于分别实现 重点在于两种情况合并实现

    testxuanbuxuan.php <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  10. 微信小程序获取复选框全选，反选选中的值

    wxml文件 <view class="tr"> <view class="th"> <checkbox bindtap=&quo ...

随机推荐

  1. 【74.89%】【codeforces 551A】GukiZ and Contest

    time limit per test2 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...

  2. 【codeforces 760C】Pavel and barbecue

    time limit per test2 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...

  3. 【codeforces 750F】New Year and Finding Roots

    time limit per test2 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...

  4. WPF中自动增加行（动画）的TextBox

    原文:WPF中自动增加行(动画)的TextBox WPF中自动增加行(动画)的TextBox WPF中的Textbox控件是可以自动换行的,只要设置TextWrapping属性为"Wrap& ...

  5. jQuery树形菜单，使用zTree插件,异步载入 &amp; 编辑功能&amp;Check 共存

    一.下载zTree插件 地址:http://www.ztree.me 二.HTML代码 <%@ Page Language="C#" AutoEventWireup=&quo ...

  6. 文件控制 fcntl函数具体解释

    摘要:本文主要讨论文件控制fcntl函数的基本应用.dup函数能够拷贝文件描写叙述符,而fcntl函数与dup函数有着异曲同工之妙.而且还有更加强大的功能,能够获取或设置已打开文件的性质,操作文件锁. ...

  7. Web自动化测试（全网最给力自动化教程）

    http://www.cnblogs.com/zidonghua/p/7430083.html python+selenium自动化软件测试(第2章):WebDriver API 欢迎您来阅读和练手! ...

  8. Android分享介绍

    一.使用系统分享 public void execShare(Activity context,String title,String text){ Intent intent = new Inten ...

  9. CCD 与 CMOS

    窗帘快门与全局快门: 窗帘快门,每次只允许一条缝的光线摄入,因此会呈现自上而下的扫描式拍摄,也就意味着画面上的不同高度,其实拍摄的时间是不同的,也就进一步造成了在高速移动的火车上,如果拍摄窗外的景物, ...

  10. Leetcode 242 Valid Anagram 字符串处理

    字符串s和字符串t是否异构,就是统计两个字符串的a-z的字符数量是否一值 class Solution { public: bool isAnagram(string s, string t) { ] ...