一、jquery常用的事件

click(),dbclick()

focus(),blur()

change()

keydown(),keypress(),keyup()

mousedown(),mouseup()    mouseenter(),mouseleave()  mouseover(),mouseout()  mousemove()

二、jquery挂事件

$（“p”）.bind("事件名称”，要执行的匿名函数)

$（“p”）.unbind("事件名称”)

三、jquery实现全选功能(重点是属性用.prop()，不用.attr())

代码如下：

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="{utf-8}">
  5.         <title></title>
  6.         <script src="../jquery-3.2.0.js"></script>
  7.     </head>
  8.     <body>
  9.         <form>
  10.             <input type="checkbox" class="all"/>省市<br />
  11.             <input type="checkbox" class="a"/>山东
  12.             <input type="checkbox" class="a"/>山西
  13.             <input type="checkbox" class="a"/>北京
  14.             <input type="checkbox" class="a"/>河北
  15.             <input type="checkbox" class="a"/>江苏
  16.         </form>
  17.     </body>
  18. </html>
  19. <script>
  20.     $(".all").click(function(){
  21. //        alert($(this)[0].checked);//如果选中则返回true;否则返回false
  22.         var a= $(this)[0].checked; //dom对象
  23.  
  24. //      alert($(this).prop("checked"));
  25.          var a=$(this).prop("checked");//获取jquery对象
  26.  
  27. //改变子复选框的状态  用prop代替attr，解决了之前用js写出现的bug,但是在源代码中查不到
  28.     $(".a").prop("checked",a);  
  29.  
  30.     })
  31. </script>

对比js全选代码：{2017-05-03日的详情见数据访问（租房子多条件查询）}

  1. function quanxuan(a,ff)
  2. {
  3.     var ck = document.getElementsByClassName(ff);
  4.     if(a.checked)
  5.     {
  6.         for(var i=0;i<ck.length;i++)
  7.         {
  8.             ck[i].setAttribute("checked","checked");
  9.         }
  10.     }
  11.     else
  12.     {
  13.         for(var i=0;i<ck.length;i++)
  14.         {
  15.             ck[i].removeAttribute("checked");
  16.         }
  17.     }
  18. }
  19. </script>

　　

此外，jquery可以替代js的一切功能，除了settimeout,setinterval

jquery与js实现全选功能的区别---2017-05-12的更多相关文章

  1. JS实现全选功能

    000. 开始 学习JS有一段时间了,最近看了一些JS练手的小demo实例,自己也尝试着用JS进行实现. 全选功能是在很多注册页面.获取用户兴趣爱好.让用户勾选一些选项等页面中常见的一种效果,主要有全 ...

  2. JQUERY的给Check全选功能

    //给Checkbox提供全选功能 $("#checkall").click(function(){ if(this.checked){ $("input[name='c ...

  3. 使用js实现全选功能。（全选，全不选，反选）

    作业210721 提交代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  4. JS全选功能代码优化

    原文:JS全选功能代码优化 JS全选功能代码优化 最近在看javascript MVC那本书,也感觉到自己写的代码也并不优雅,所以一直在想 用另一种模式来编写JS代码,所以针对之前的简单的JS全选功能 ...

  5. js初学—实现checkbox全选功能

    布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id=& ...

  6. jquery实现全选功能

    主要是模拟一些网页中的表格实现全选功能. <form> 你爱好的运动是: <input type="checkbox" id="Check" ...

  7. 问题1：jquery实现全选功能，第二次失效（已解决）

    问题:使用了attr("checked",true”)设置子复选框的被选状态,第一次执行功能正常,但第二次失效. 解决方案:将attr("checked",tr ...

  8. S全选功能代码

    JS全选功能代码优化 2014-06-26 00:00 by 龙恩0707, 470 阅读, 3 评论, 收藏, 编辑 JS全选功能代码优化 最近在看javascript MVC那本书,也感觉到自己写 ...

  9. EasyUI datagrid 复选框可以多选但不能全选功能实现

    1.功能需求:  实现多选,但是不能够全选功能 2.js代码 //帮卖列表页面,可以多选但是不能够全选实现 $(".datagrid-header-check").children ...

随机推荐

  1. Intellj IDEA 简易教程

    Intellj IDEA 简易教程 目录 JDK 安装测试 IDEA 安装测试 调试 单元测试 重构 Git Android 其他 参考资料 Java开发IDE(Integrated Developm ...

  2. Vijos1144小胖守皇宫【树形DP】

    皇宫看守 太平王世子事件后,陆小凤成了皇上特聘的御前一品侍卫.皇宫以午门为起点,直到后宫嫔妃们的寝宫,呈一棵树的形状:某些宫殿间可以互相望见.大内保卫森严,三步一岗,五步一哨,每个宫殿都要有人全天候看 ...

  3. C#研究OpenXML之路(4-使用第三方库)

    一.悲催的OpenXML操作 学习并使用了一段时间的OpenXML,感觉用这个来操作Excel文件真是一件非常悲催的事情,由于我自己比较熟悉Excel COM的操作,但到了OpenXML中发现,之前所 ...

  4. TensorFlow 安装详解

    摘要: 原创出处:www.bysocket.com 泥瓦匠BYSocket 希望转载,保留摘要,谢谢! 『不要把手段当成目标 — <一个瑜伽行者的自传>』   本文提纲 1. 机器学习 2 ...

  5. QTP自动化测试框架课程的目标

    QTP自动化测试框架课程的目标 随着技术发展演变,qtp自动化测试工具有逐渐被其他工具和技术替换的趋势,所以我们三个POPTEST合伙人决定把qtp自动化测试的一套课程开放免费,这套qtp自动化测试课 ...

  6. （转）POPTEST联合创始人李爱然的“IT培训创业的随想"

    IT教育行业最大的问题是缺少像互联网行业一样的产品经理. 大多数IT教育机构在早期依靠个人或者一套课程开创了一定的局面,随着机构的壮大,机构把市场营销提到至高点,销售至上,而把产品(培训产品)放在后面 ...

  7. eclipse中配置drools6.5环境

    1.去官网下载两个压缩包 2.解压两个压缩包,依次进入droolsjbpm-tools-distribution-6.5.0.Final\droolsjbpm-tools-distribution-6 ...

  8. Timer,TimerTask通过程序计数器实现的定时任务

    1.程序计数器 程序计数器(Program Counter Register)是一块较小的内存空间,它的作用可以看 做是当前线程所执行的字节码的行号指示器.在虚拟机的概念模型里(仅是概念模型, 各种虚 ...

  9. CSS3－渐变背景色

    线性渐变背景色: <style> .linear { width:130px; height:130px; border:2px solid black; padding: 10px; b ...

  10. 用Rvm安装Ruby，Rails运行环境及常见错误解决方法

    一.安装Rvm 1.下载安装Rvm $ curl -L https://get.rvm.io | bash -s stable 此时可能出现错误:"gpg: 无法检查签名:找不到公钥&quo ...