首页 > PHP资讯 > HTML5培训技术 > jquery全选、全不选、反选效果的实现代码【推荐】_jquery

jquery全选、全不选、反选效果的实现代码【推荐】_jquery

HTML5培训技术
jquery 全选、全不选、反选效果的实现代码【推荐】

首先:引入jquery

haran.info_jquery实例_全选全不选反选_select-all_unselect-all_reverse<script src="/js/jquery-1.8.3.min.js?1.1.15"type="text/javascript">《script》
 

样式:


 

body布局:

   


实现功能:

<scripttype="text/javascript">$(document).ready(function () {        $("#selAll").click(function () { //":checked"匹配所有的复选    $("#p1 :checkbox").attr("checked", true); //"#p1 :checked"之间必须有空格checked是设置选中状态。如果为true则是选中fo否则false为不选中  });        $("#unselAll").click(function () {     $("#p1 :checkbox").attr("checked", false);   });        //理解用迭代原理each(function(){})  $("#reverse").click(function () {   $("#p1 :checkbox").each(function () {  $(this).attr("checked",!$(this).attr("checked")); //!$(this).attr("checked")判断复选框的状态:如果选中则取反    });   });}); 《script》

以上这篇jquery 全选、全不选、反选效果的实现代码【推荐】就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

HTML5培训技术

本文由欣才IT学院整理发布,未经许可,禁止转载。
支持30不支持0