复选框 全选 全不选 反选 实现
生活随笔
收集整理的這篇文章主要介紹了
复选框 全选 全不选 反选 实现
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head><title>新建網頁</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="description" content="" /><meta name="keywords" content="" /><script type="text/javascript" src="./jquery-1.4.4.js"></script><script type="text/javascript">function selAll(){//全選 $('li').css('color','red');//jquery內部大部分方法本身有“遍歷”機制，可以為每個元素節點對象進行相關的功能操作$('.hby').attr("checked",true);}function selNotAll(){//全不選$('.hby').attr('checked',false);}function selFan(){//反選//遍歷全部的復選框，查看每個項目的選中狀態，并做處理(選中就取消，否則設置選中)for(var i=0; i<$('.hby').length; i++){var flag = $('.hby:eq('+i+')').attr('checked');$('.hby:eq('+i+')').attr('checked',!flag);}}</script></head><body><h2>復選框選中操作</h2>愛好(復選框):<input type="checkbox" class="hby" name="hobby[]" value="1" />籃球<input type="checkbox" class="hby" name="hobby[]" value="2" />看書<input type="checkbox" class="hby" name="hobby[]" value="3" />上網<input type="checkbox" class="hby" name="hobby[]" value="4" />聽音樂<br /><br /><input type="button" value="全選" οnclick="selAll()" /><input type="button" value="全不選" οnclick="selNotAll()" /><input type="button" value="反選" οnclick="selFan()" /></body>
</html>
總結
以上是生活随笔為你收集整理的复选框 全选 全不选 反选 实现的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： pip安装软件时出现Command py
- 下一篇： 分治算法例子集锦