jQuery操作CheckBox的方法介绍(选中,取消,取值)

代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<HTML>  
 <HEAD>  
  <TITLE> New document.nbsp;</TITLE>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
    <SCRIPT LANGUAGE="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>  
  <SCRIPT LANGUAGE="javascript">  
  <!--  
   $("document.quot;).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($(this).val());  
    })  
   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>

(0)

相关推荐

  • jQuery判断checkbox是否选中的3种方法

    网上大多数文章都提供的方法都是无效的,害死个人,本文中的方法小编亲测试有效,建议使用方法二: 方法一: if ($("#checkbox-id")get(0).checked) {     // do something } 方法二: if($('#checkbox-id').is(':checked')) {     // do something } 方法三: if ($('#checkbox-id').attr('checked')) {     // do something

  • JQuery对checkbox操作 (循环获取)

    复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="DemoCheckBox.aspx.cs" Inherits="DemoCheckBox" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

  • JQuery触发radio或checkbox的change事件

    早上要做一功能,checkbox被选中时,显示隐藏的层,取消选中时,再隐藏选中的层. 初始代码如下: 复制代码 代码如下: $(function(){ $("#ischange").change(function() { alert("checked"); }); }); 捣腾了半天,竟然一点反应都没有.百度了下,有高人指出上面几行代码在Firefox等浏览器中可以正常运行,即你选中复选框或取消复选框都会弹出一个对话框,但是在IE中却不会正常执行,即选中或取消复选框

  • jquery操作复选框(checkbox)的12个小技巧总结

    1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$("input:[type='checkbox']:checked").val();或者$("input:[name='ck']:checked").val(); 2. 获取多个checkbox选中项$('input:checkbox').each(function() {        if ($(this).attr('che

  • JQUERY复选框CHECKBOX全选,取消全选

    复制代码 代码如下: <script type="text/javascript"> $(function() { $("#checkall").click(function() { $("input[@name='checkname[]']").each(function() { $(this).attr("checked", true); }); }); $("#delcheckall").

  • jquery一键控制checkbox全选、反选或全不选

    jquery attr()方法获取标签的 checked 会有问题,所以用了 prop() 方法. Hml的checkbox没有加name,只用了 div 嵌套. 如有更好的方法,望指点!! //全选 $('#allChecked').change(function(){ $('#box').children(':checkbox').prop('checked',$(this).is(':checked')?true:false); }); //反选 $('#invertChecked').c

  • jquery判断checkbox(复选框)是否被选中的代码

    复制代码 代码如下: //是否被选中验证有选中的return true,否return false function mycheckbox() { var falg = 0; $("input[name='soft[]']:checkbox").each(function () { if ($(this).attr("checked")) { falg += 1; } }) if (falg > 0) return true; else return fals

  • Jquery为单选框checkbox绑定单击click事件

    一.假设有如下一段html代码 复制代码 代码如下: <dd id="1"> <input id="checkbox-518" class="imagezz" name type="checkbox" value="518"> </dd> 选中事件(根据选中情况修改上一层背景): 复制代码 代码如下: var $test_image_check_box_click = f

  • jquery实现全选、反选、获得所有选中的checkbox

    举了7个不同的checkbox状态,和大家一一分享. 1.全选 $("#btn1").click(function(){ $("input[name='checkbox']").attr("checked","true"); }) 2.取消全选(全不选) $("#btn2").click(function(){ $("input[name='checkbox']").removeAttr

  • Jquery遍历checkbox获取选中项value值的方法

    源码: 复制代码 代码如下: jQuery(function($){ $("input[name='key']:checkbox").click(function(){ var ids = ''; var flag = 0; $("#ids").attr("value",ids); $("input[name='key']:checkbox").each(function(){ if (true == $(this).attr

随机推荐