jQuery复选框操作详解编程语言

<html> 
 
<head> 
 
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
 
<script type="text/javascript"> 
 
$(function(){ 
 
  $('#CheckedAll').click(function(){ 
 
    $('[name=items]:checkbox').attr('checked', true); 
 
  }); 
 
  $('#CheckedNo').click(function(){ 
 
    $('[name=items]:checkbox').attr('checked', false); 
 
  }); 
 
  $('#CheckedRev').click(function(){ 
 
    $('[name=items]:checkbox').each(function(){ 
 
      if($(this).attr('checked')){ 
 
        $(this).attr('checked', false); 
 
      }else{ 
 
        $(this).attr('checked', true); 
 
      } 
 
    }); 
 
  }); 
 
  $('#send').click(function(){ 
 
    var str = "你选中的是: /r/n"; 
 
    $('[name=items]:checkbox:checked').each(function(){ 
 
      str += $(this).val() + "/r/n"; 
 
    }); 
 
    alert(str); 
 
  }); 
 
}); 
 
</script> 
 
</head> 
 
<body> 
 
<form action="#" method="POST" id="regForm"> 
 
你爱好的运动是?<br /> 
 
<input type="checkbox" name="items" value="足球" />足球 
 
<input type="checkbox" name="items" value="蓝球" />篮球 
 
<input type="checkbox" name="items" value="羽毛球" />羽毛球 
 
<input type="checkbox" name="items" value="乒乓球" />乒乓球 
 
<input type="button" id="CheckedAll" value="全 选" /> 
 
<input type="button" id="CheckedNo" value="全不选" /> 
 
<input type="button" id="CheckedRev" value="反 选" /> 
 
<input type="button" id="send" value="提 交" /> 
 
</form> 
 
</body> 
 
</html> 
 
 

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/8643.html

(0)
上一篇 2021年7月18日
下一篇 2021年7月18日

相关推荐

发表回复

登录后才能评论